pizhengyu/threeonecheck_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
皮
2025-12-29 14:59:44 +08:00
commit 10c3fbb0d7
5315 changed files with 795443 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

540
pages/hiddendanger/Inspection.vue Normal file
View File

@@ -0,0 +1,540 @@
<template>
<view class=" page padding">
<view class="padding radius bg-white list-list margin-bottom" v-for="item in hiddenDangerList" :key="item.hazardId">
<view class="flex justify-between margin-bottom">
<view class="text-bold text-black">{{item.title}}</view>
<view class="text-blue">{{item.statusName}}</view>
</view>
<view class="flex margin-bottom">
<view class="text-gray">隐患等级：</view>
<view>{{item.levelName}}</view>
</view>
<view class="flex margin-bottom">
<view class="text-gray" style="white-space: nowrap;">隐患位置：</view>
<view class="text-black">{{item.address}}</view>
</view>
<view class="flex margin-bottom">
<view class="text-gray">创建时间：</view>
<view class="text-black">{{item.createdAt}}</view>
</view>
<view class="flex col-3" style="gap: 10rpx;">
<button class="round cu-btn lg light bg-blue" @click="details(item)">查看详情</button>
<button class="round cu-btn lg light bg-blue" @click="Rectification(item)">立即整改</button>
<button class="round cu-btn lg bg-blue" @click="acceptance()">立即验收</button>
</view>
</view>
<button class="cuIcon-add round bg-blue margin-top-xl" @click="showAddPopup = true">新增</button>
<!-- 新增弹窗 -->
<u-popup :show="showAddPopup" mode="center" round="20" @close="showAddPopup = false">
<view class="popup-content">
<view class="popup-header">
<view class="popup-title text-bold">新增隐患排查</view>
<view class="popup-close" @click="showAddPopup = false">×</view>
</view>
<view class="popup-body">
<view class="flex margin-bottom">
<view class="text-gray">隐患图片/视频</view>
<view class="text-red">*</view>
</view>
<up-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="10"></up-upload>
<view class="text-gray text-sm">必填：请上传现场照片或者视频作为隐患证据</view>
<view class="flex margin-bottom margin-top">
<view class="text-gray">隐患标题</view>
<view class="text-red">*</view>
</view>
<up-input placeholder="请输入内容" border="surround" v-model="formData.title"></up-input>
<view class="text-sm text-gray margin-top-xs">请用简洁的语言概括隐患要点</view>
<view class="flex margin-bottom margin-top">
<view class="text-gray">隐患等级</view>
<view class="text-red">*</view>
</view>
<up-choose v-model="formData.level" :options="levelOptions" :wrap="false" item-width="183rpx" item-height="72rpx"></up-choose>
<view class="flex margin-bottom margin-top">
<view class="text-gray">隐患位置</view>
<view class="text-red">*</view>
</view>
<view class="address-box">
<view class="address-input" @click="showAddressPopup = true">
<text :class="selectedAddress ? '' : 'text-gray'">{{ selectedAddress || '请选择地址' }}</text>
</view>
<button class="btn-address bg-blue" @click="showAddressPopup = true">选择地址</button>
</view>
<!-- 地址选择弹窗 -->
<u-popup :show="showAddressPopup" mode="center" round="20" @close="showAddressPopup = false">
<view class="address-popup">
<view class="popup-header">
<view class="popup-title text-bold">选择地址</view>
<view class="popup-close" @click="showAddressPopup = false">×</view>
</view>
<view class="address-popup-body">
<view class="search-box">
<input class="search-input" v-model="addressKeyword" placeholder="请输入关键词搜索" />
</view>
<view class="address-list">
<view class="address-item" v-for="(item, index) in filteredAddressList" :key="index"
@click="tempSelectedAddress = item" :class="{'address-item-active': tempSelectedAddress === item}">
<text>{{ item }}</text>
</view>
</view>
</view>
<view class="popup-footer">
<button class="btn-cancel" @click="showAddressPopup = false">取消</button>
<button class="btn-confirm bg-blue" @click="confirmAddress">定位</button>
</view>
</view>
</u-popup>
<view class="text-gray text-sm margin-top-xs">如：办公楼3层东侧消防通道、生产车间A区设备旁等，或点击"选择地址"按钮在地图上选择</view>
<view class="flex margin-bottom margin-top">
<view class="text-gray">隐患描述</view>
<view class="text-red">*</view>
</view>
<up-textarea v-model="formData.description" placeholder="请输入内容" ></up-textarea>
<view class="text-gray text-sm margin-top-xs">请详细说明隐患现状、潜在风险及影响范围</view>
<view class="text-gray margin-bottom margin-top">隐患标签</view>
<up-choose v-model="formData.tagIndex" :options="tagOptions"></up-choose>
<view class="text-gray text-sm">可选择多个相关标签对隐患进行分类</view>
</view>
<view class="popup-footer">
<button class="btn-cancel" @click="showAddPopup = false">取消</button>
<button class="btn-confirm bg-blue" @click="handleAdd">确定</button>
</view>
</view>
</u-popup>
</view>
</template>
<script setup>
import { ref, computed, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { addHiddenDanger, enterCheckPlan, getCheckTaskDetail,getMyHiddenDangerList,getHiddenDangerLabelList} from '@/request/api.js'
import { baseUrl,AUTH_TOKEN } from '@/request/request.js'
// 弹窗控制
const showAddPopup = ref(false);
// 任务相关ID（从接口获取）
const taskId = ref('');
const checkPointId = ref('');
// 获取任务详情
const fetchTaskInfo = async (oneTableId) => {
try {
// 第一步：调用 start 接口获取 taskId
const startRes = await enterCheckPlan(oneTableId);
if (startRes.code === 0 && startRes.data) {
const tid = startRes.data.taskId;
// 第二步：用 taskId 获取任务详情
const detailRes = await getCheckTaskDetail(tid);
if (detailRes.code === 0 && detailRes.data) {
taskId.value = detailRes.data.taskId;
checkPointId.value = detailRes.data.checkPointId;
}
}
} catch (error) {
console.error('获取任务信息失败:', error);
}
};
onLoad((options) => {
if (options.id) {
fetchTaskInfo(options.id);
}
});
// 表单数据
const formData = reactive({
title: '', // 隐患标题
level: 0, // 隐患等级索引
description: '', // 隐患描述
tagIndex: 0, // 隐患标签索引
});
// 经纬度
const lng = ref(0);
const lat = ref(0);
// 地址选择
const showAddressPopup = ref(false);
const addressKeyword = ref('');
const selectedAddress = ref('');
const tempSelectedAddress = ref('');
const addressList = ref([
'湖南省湘西土家族苗族自治州吉首市人民北路105号',
'湖南省湘西土家族苗族自治州吉首市人民南路100号',
'湖南省湘西土家族苗族自治州吉首市团结广场',
'湖南省湘西土家族苗族自治州吉首市火车站'
]);
const filteredAddressList = computed(() => {
if (!addressKeyword.value) return addressList.value;
return addressList.value.filter(item => item.includes(addressKeyword.value));
});
const confirmAddress = () => {
if (tempSelectedAddress.value) {
selectedAddress.value = tempSelectedAddress.value;
}
showAddressPopup.value = false;
};
// 确定新增
const handleAdd = async () => {
// 表单验证
if (!formData.title) {
uni.showToast({ title: '请输入隐患标题', icon: 'none' });
return;
}
if (fileList1.value.length === 0) {
uni.showToast({ title: '请上传隐患图片/视频', icon: 'none' });
return;
}
// 构建附件列表 - 从上传返回的url中提取文件名
const attachments = fileList1.value.map(file => {
// 确保 url 是字符串
let url = '';
if (typeof file.url === 'string') {
url = file.url;
} else if (file.url && typeof file.url === 'object') {
url = file.url.url || file.url.path || '';
}
// 从url中提取文件名
const fileName = (typeof url === 'string' && url) ? url.split('/').pop() : (file.name || '');
return {
fileName: fileName || '',
filePath: url || '',
fileType: file.type || 'image/png',
fileSize: file.size || 0
};
});
// 获取隐患标签ID
const selectedTag = tagOptions.value[formData.tagIndex];
const tagId = selectedTag ? selectedTag.id : null;
// 构建请求参数
const params = {
title: formData.title,//标题
level: formData.level + 1, // 1.轻微隐患 2.一般隐患 3.重大隐患
lng: lng.value || 0,//经度
lat: lat.value || 0,//纬度
address: selectedAddress.value || '',//详细地址
description: formData.description || '',//隐患描述
tagId: tagId,//隐患标签ID
taskId: taskId.value, //关联任务ID
checkPointId: checkPointId.value,//关联检查点ID
source:'cillum labore veniam',//隐患来源
};
//
try {
const res = await addHiddenDanger(params);
if (res.code === 0) {
uni.showToast({
title: '新增成功',
icon: 'success'
});
showAddPopup.value = false;
// 重置表单
formData.title = '';
formData.level = 0;
formData.description = '';
formData.tagIndex = 0;
selectedAddress.value = '';
fileList1.value = [];
} else {
uni.showToast({ title: res.msg || '新增失败', icon: 'none' });
}
} catch (error) {
console.error(error);
uni.showToast({ title: '请求失败', icon: 'none' });
}
};
//获取隐患列表
const hiddenDangerList = ref([]);
const fetchHiddenDangerList = async () => {
try {
const res = await getMyHiddenDangerList();
if (res.code === 0) {
hiddenDangerList.value = res.data;
} else {
uni.showToast({ title: res.msg || '获取隐患列表失败', icon: 'none' });
}
} catch (error) {
console.error(error);
uni.showToast({ title: '请求失败', icon: 'none' });
}
};
fetchHiddenDangerList();
const details = (item) => {
uni.navigateTo({
url: `/pages/hiddendanger/view?hazardId=${item.hazardId}&assignId=${item.assignId}`
})
}
const Rectification = (item) => {
uni.navigateTo({
url: `/pages/hiddendanger/rectification?hazardId=${item.hazardId}&assignId=${item.assignId}`
})
}
const acceptance = () => {
uni.navigateTo({
url: '/pages/hiddendanger/acceptance'
})
}
const fileList1 = ref([]);
// 删除图片
const deletePic = (event) => {
fileList1.value.splice(event.index, 1);
};
// 新增图片
const afterRead = async (event) => {
// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
let lists = [].concat(event.file);
let fileListLen = fileList1.value.length;
lists.map((item) => {
fileList1.value.push({
...item,
status: 'uploading',
message: '上传中',
});
});
for (let i = 0; i < lists.length; i++) {
const result = await uploadFilePromise(lists[i].url);
let item = fileList1.value[fileListLen];
fileList1.value.splice(fileListLen, 1, {
...item,
status: 'success',
message: '',
url: result,
});
fileListLen++;
}
};
const uploadFilePromise = (filePath) => {
return new Promise((resolve, reject) => {
uni.uploadFile({
url: baseUrl + '/frontend/attachment/upload',
filePath: filePath,
name: 'file',
header: {
'Authorization': AUTH_TOKEN
},
success: (res) => {
const data = JSON.parse(res.data);
if (data.code === 0) {
resolve(data.data);
} else {
reject(data.msg || '上传失败');
}
},
fail: (err) => {
console.error('上传失败:', err);
reject(err);
}
});
});
};
// 隐患标签选项
// const tagOptions = ref([
// {id: 1, title: '安全'},
// {id: 2, title: '人机工程'},
// {id: 3, title: '其他'},
// {id: 4, title: '职业健康'},
// {id: 5, title: '电气隐患'},
// {id: 6, title: '环保'}
// ])
const tagOptions = ref([]);
const fetchTagOptions = async () => {
try {
const res = await getHiddenDangerLabelList();
if (res.code === 0) {
// 将接口返回的 name 字段映射为 title 字段，供 up-choose 组件使用
tagOptions.value = res.data.map(item => ({
id: item.id,
title: item.name
}));
} else {
uni.showToast({ title: res.msg || '获取标签列表失败', icon: 'none' });
}
} catch (error) {
console.error(error);
uni.showToast({ title: '请求失败', icon: 'none' });
}
};
fetchTagOptions();
//
// 隐患等级选项
const levelOptions = ref([
{id: 1, title: '轻微隐患'},
{id: 2, title: '一般隐患'},
{id: 3, title: '重大隐患'}
])
</script>
<style lang="scss" scoped>
.page {
min-height: 100vh;
background: #EBF2FC;
}
.list-list {
background: #FFFFFF;
box-shadow: 0rpx 2rpx 6rpx 2rpx rgba(0, 0, 0, 0.08);
border-left: 5px solid #2667E9;
border-radius: 20rpx;
padding: 20rpx;
}
.popup-content {
width: 600rpx;
background: #fff;
border-radius: 20rpx;
overflow: hidden;
}
.popup-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx;
border-bottom: 1rpx solid #eee;
.popup-title {
font-size: 32rpx;
color: #333;
}
.popup-close {
font-size: 40rpx;
color: #999;
line-height: 1;
}
}
.popup-body {
padding: 30rpx;
max-height: 900rpx;
overflow-y: auto;
}
.popup-footer {
display: flex;
border-top: 1rpx solid #eee;
button {
flex: 1;
height: 90rpx;
line-height: 90rpx;
border-radius: 0;
font-size: 30rpx;
&::after {
border: none;
}
}
.btn-cancel {
background: #fff;
color: #666;
}
.btn-confirm {
color: #fff;
}
}
.address-box {
display: flex;
align-items: center;
gap: 20rpx;
.address-input {
flex: 1;
background: #fff;
border: 1rpx solid #F6F6F6;;
border-radius: 8rpx;
padding: 20rpx;
font-size: 26rpx;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.btn-address {
flex-shrink: 0;
height: 70rpx;
line-height: 70rpx;
padding: 0 30rpx;
font-size: 26rpx;
border-radius: 8rpx;
color: #fff;
&::after {
border: none;
}
}
}
.address-popup {
width: 600rpx;
background: #fff;
border-radius: 20rpx;
overflow: hidden;
}
.address-popup-body {
padding: 30rpx;
max-height: 500rpx;
.search-box {
margin-bottom: 20rpx;
.search-input {
width: 100%;
background: #f5f5f5;
border-radius: 8rpx;
padding: 16rpx 20rpx;
font-size: 28rpx;
}
}
.address-list {
max-height: 350rpx;
overflow-y: auto;
}
.address-item {
padding: 24rpx 20rpx;
border-bottom: 1rpx solid #eee;
font-size: 26rpx;
color: #333;
&:last-child {
border-bottom: none;
}
&.address-item-active {
background: #EBF2FC;
color: #2667E9;
}
}
}
</style>
<style lang="scss">
/* 全局样式覆盖 up-tag 文字居中 */
.u-tag {
justify-content: center !important;
}
</style>