first commit
This commit is contained in:
540
pages/hiddendanger/Inspection.vue
Normal file
540
pages/hiddendanger/Inspection.vue
Normal 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>
|
||||
80
pages/hiddendanger/acceptance.vue
Normal file
80
pages/hiddendanger/acceptance.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<view class="page padding">
|
||||
<view class="padding bg-white radius">
|
||||
<view class="text-gray margin-bottom">整改记录</view>
|
||||
<up-textarea v-model="value1" placeholder="请输入内容"></up-textarea>
|
||||
<view class="flex margin-bottom margin-top">
|
||||
<view class="text-gray">验收内容</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-textarea v-model="value1" placeholder="请输入内容"></up-textarea>
|
||||
<view class="flex margin-bottom margin-top">
|
||||
<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>
|
||||
<button class="bg-blue round margin-top-xl"> 提交验收</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
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 = (url) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
let a = uni.uploadFile({
|
||||
url: 'http://192.168.2.21:7001/upload', // 仅为示例,非真实的接口地址
|
||||
filePath: url,
|
||||
name: 'file',
|
||||
formData: {
|
||||
user: 'test',
|
||||
},
|
||||
success: (res) => {
|
||||
setTimeout(() => {
|
||||
resolve(res.data.data);
|
||||
}, 1000);
|
||||
},
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #EBF2FC;
|
||||
}
|
||||
</style>
|
||||
237
pages/hiddendanger/rectification.vue
Normal file
237
pages/hiddendanger/rectification.vue
Normal file
@@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<view class="page padding">
|
||||
<view class="padding bg-white radius">
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray">整改方案</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-textarea v-model="formData.rectifyPlan" placeholder="请输入内容"></up-textarea>
|
||||
<view class="flex margin-bottom margin-top">
|
||||
<view class="text-gray">整改完成情况</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-textarea v-model="formData.rectifyResult" placeholder="请输入内容"></up-textarea>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray margin-top">投资资金(计划)</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-input v-model="formData.planCost" placeholder="请输入内容" type="number"></up-input>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray margin-top">投资资金(实际)</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-input v-model="formData.actualCost" placeholder="请输入内容" type="number"></up-input>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray margin-top">限定整改时间</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<view class="date-input" @click="show = true">
|
||||
<text :class="selectedDate ? '' : 'text-gray'">{{ selectedDate || '请选择日期' }}</text>
|
||||
</view>
|
||||
<up-calendar :show="show" :mode="mode" @confirm="confirmDate" @close="show = false"></up-calendar>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray">整改人员</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-radio-group v-model="radiovalue1" placement="column" @change="groupChange">
|
||||
<up-radio shape="square" :customStyle="{marginBottom: '8px'}" v-for="(item, index) in radiolist1"
|
||||
:key="index" :label="item.name" :name="item.name" @change="radioChange"></up-radio>
|
||||
</up-radio-group>
|
||||
<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>
|
||||
<button class="bg-blue round margin-top-xl" @click="handleSubmit">提交整改</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ref,reactive} from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import {submitRectification} from '@/request/api.js'
|
||||
import { baseUrl, AUTH_TOKEN } from '@/request/request.js'
|
||||
|
||||
// 从页面参数获取的ID
|
||||
const hazardId = ref('');
|
||||
const assignId = ref('');
|
||||
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
rectifyPlan: '', // 整改方案
|
||||
rectifyResult: '', // 整改完成情况
|
||||
planCost: '', // 投资资金(计划)
|
||||
actualCost: '' // 投资资金(实际)
|
||||
});
|
||||
|
||||
const show = ref(false);
|
||||
const mode = ref('single');
|
||||
const selectedDate = ref('');
|
||||
const radiovalue1 = ref('');
|
||||
|
||||
// 基本案列数据
|
||||
const radiolist1 = reactive([{
|
||||
name: '孙致远',
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
name: '符友成',
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
name: '向彪',
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
name: '向纪荣',
|
||||
disabled: false,
|
||||
},
|
||||
]);
|
||||
// 上传图片
|
||||
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 confirmDate = (e) => {
|
||||
selectedDate.value = e[0];
|
||||
show.value = false;
|
||||
};
|
||||
|
||||
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 handleSubmit = async () => {
|
||||
if (!formData.rectifyPlan) {
|
||||
uni.showToast({ title: '请输入整改方案', icon: 'none' });
|
||||
return;
|
||||
}
|
||||
if (!formData.rectifyResult) {
|
||||
uni.showToast({ title: '请输入整改完成情况', icon: 'none' });
|
||||
return;
|
||||
}
|
||||
|
||||
// 构建附件列表
|
||||
const attachments = fileList1.value.map(file => {
|
||||
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 || '';
|
||||
}
|
||||
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
|
||||
};
|
||||
});
|
||||
|
||||
const params = {
|
||||
hazardId: hazardId.value,
|
||||
assignId: assignId.value,
|
||||
rectifyPlan: formData.rectifyPlan,
|
||||
rectifyResult: formData.rectifyResult,
|
||||
planCost: Number(formData.planCost) || 0,
|
||||
actualCost: Number(formData.actualCost) || 0,
|
||||
attachments: attachments
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await submitRectification(params);
|
||||
if (res.code === 0) {
|
||||
uni.showToast({ title: '提交成功', icon: 'success' });
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1500);
|
||||
} else {
|
||||
uni.showToast({ title: res.msg || '提交失败', icon: 'none' });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('提交整改失败:', error);
|
||||
uni.showToast({ title: '请求失败', icon: 'none' });
|
||||
}
|
||||
};
|
||||
|
||||
onLoad((options) => {
|
||||
if (options.hazardId) {
|
||||
hazardId.value = options.hazardId;
|
||||
}
|
||||
if (options.assignId) {
|
||||
assignId.value = options.assignId;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #EBF2FC;
|
||||
}
|
||||
|
||||
.date-input {
|
||||
background: #fff;
|
||||
border-radius: 8rpx;
|
||||
padding: 24rpx 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
border: 1rpx solid #F6F6F6 ;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
131
pages/hiddendanger/view.vue
Normal file
131
pages/hiddendanger/view.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<view class="padding page">
|
||||
<view class="padding bg-white radius">
|
||||
<view class="flex">
|
||||
<view class="text-gray">隐患图片/视频</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<view class="margin-bottom">
|
||||
<view class="flex" style="flex-wrap: wrap; gap: 10rpx;" v-if="detailData?.attachments && detailData.attachments.length > 0">
|
||||
<image v-for="(img, idx) in detailData.attachments" :key="idx" :src="img.filePath" style="width: 136rpx;height: 136rpx;border-radius: 16rpx;" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view v-else class="text-gray text-sm">暂无图片</view>
|
||||
<view class="text-gray text-sm margin-top-xs">必填:请上传现场照片或者视频作为隐患证据</view>
|
||||
</view>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray">隐患标题</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-input v-model="detailData.title" disabled="true" disabledColor="#F6F6F6" border="surround"/>
|
||||
<view class="margin-bottom text-gray text-sm margin-top-xs" >请用简洁的语言概括隐患要点</view>
|
||||
<view class="flex margin-bottom">
|
||||
<view class="text-gray">隐患等级</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<view class="flex col-3" style="gap: 10rpx;">
|
||||
<view :class="detailData.level === 1 ? 'bg-blue light' : 'bg-gray'" style="padding: 16rpx 40rpx;">轻微隐患</view>
|
||||
<view :class="detailData.level === 2 ? 'bg-blue light' : 'bg-gray'" style="padding: 16rpx 40rpx;">一般隐患</view>
|
||||
<view :class="detailData.level === 3 ? 'bg-blue light' : 'bg-gray'" style="padding: 16rpx 40rpx;">重大隐患</view>
|
||||
</view>
|
||||
<view class="text-gray text-sm margin-top-xs margin-bottom">请用隐患可能造成的危害程度选择等级</view>
|
||||
<view class="flex">
|
||||
<view class="text-gray">隐患位置</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<view class="address-box margin-top-sm margin-bottom-sm">
|
||||
<input
|
||||
class="address-input"
|
||||
v-model="detailData.address"
|
||||
placeholder="暂无地址"
|
||||
disabled
|
||||
/>
|
||||
<button class="address-btn bg-blue">选择地址</button>
|
||||
</view>
|
||||
<view class="text-gray text-sm">如:办公楼3层东侧消防通道,生产车间A区设备旁等,或点击"选择地址"按钮在地图上选择</view>
|
||||
<view class="flex margin-bottom ">
|
||||
<view class="text-gray">隐患描述</view>
|
||||
<view class="text-red">*</view>
|
||||
</view>
|
||||
<up-textarea v-model="detailData.description" placeholder="暂无描述" disabled></up-textarea>
|
||||
<view class="text-gray text-sm margin-top-xs margin-bottom">请详细说明隐患现状、潜在风险及影响范围</view>
|
||||
<view class="text-gray margin-bottom">隐患来源</view>
|
||||
<view class="bg-gray padding radius">{{ detailData.source || '暂无' }}</view>
|
||||
<view class="text-gray margin-top margin-bottom">创建时间</view>
|
||||
<view class="bg-gray padding radius">{{ detailData.createdAt || '暂无' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { getHiddenDangerDetail } from '@/request/api.js'
|
||||
|
||||
// 详情数据
|
||||
const detailData = reactive({
|
||||
hazardId: '',
|
||||
assignId: '',
|
||||
title: '',
|
||||
level: 0,
|
||||
levelName: '',
|
||||
source: '',
|
||||
description: '',
|
||||
address: '',
|
||||
createdAt: '',
|
||||
attachments: []
|
||||
});
|
||||
|
||||
// 获取隐患详情
|
||||
const fetchDetail = async (hazardId, assignId) => {
|
||||
try {
|
||||
const res = await getHiddenDangerDetail({ hazardId, assignId });
|
||||
if (res.code === 0 && res.data) {
|
||||
Object.assign(detailData, res.data);
|
||||
} else {
|
||||
uni.showToast({ title: res.msg || '获取详情失败', icon: 'none' });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取隐患详情失败:', error);
|
||||
uni.showToast({ title: '请求失败', icon: 'none' });
|
||||
}
|
||||
};
|
||||
|
||||
onLoad((options) => {
|
||||
if (options.hazardId && options.assignId) {
|
||||
fetchDetail(options.hazardId, options.assignId);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #EBF2FC;
|
||||
}
|
||||
|
||||
.address-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.address-input {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
background: #F6F6F6;
|
||||
border-radius: 12rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.address-btn {
|
||||
flex-shrink: 0;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
padding: 0 32rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user