From 0dac7ba33f77342d2a9a1392c820d10d3b72d76c Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期三, 28 九月 2022 16:02:47 +0800 Subject: [PATCH] '修改' --- src/views/specialWorkSystem/workTicket/workApply/components/ground.vue | 131 +++++++++++++++++++++++++++++-------------- 1 files changed, 87 insertions(+), 44 deletions(-) diff --git a/src/views/specialWorkSystem/workTicket/workApply/components/ground.vue b/src/views/specialWorkSystem/workTicket/workApply/components/ground.vue index a65e6f5..1716f56 100644 --- a/src/views/specialWorkSystem/workTicket/workApply/components/ground.vue +++ b/src/views/specialWorkSystem/workTicket/workApply/components/ground.vue @@ -1,4 +1,4 @@ -<template> + <template> <div class="home-container"> <div style="height: 100%"> <el-form :model="form" label-width="150px" :rules="applyRules" ref="ruleFormRef"> @@ -16,8 +16,6 @@ </el-select> </el-form-item> </el-col> - </el-row> - <el-row> <el-col :span="12"> <el-form-item label="作业时间" prop="workTimeLine"> <el-date-picker @@ -56,15 +54,27 @@ </el-row> <el-row> <el-col :span="12"> + <el-form-item label="危害辨识" prop="hazardIdentification"> + <el-input + v-model="form.hazardIdentification" + placeholder="请输入危害辨识" + /> + </el-form-item> + </el-col> + </el-row> + <el-divider border-style="dashed"/> + <el-row> + <el-col :span="12"> <el-form-item label="作业单位" prop="workDetail.operationDepId"> - <el-select v-model="form.workDetail.operationDepId"> - <el-option - v-for="item in csDepList" - :key="item.value" - :label="item.label" - :value="item.value" - /> - </el-select> +<!-- <el-select v-model="form.workDetail.operationDepId">--> +<!-- <el-option--> +<!-- v-for="item in csDepList"--> +<!-- :key="item.value"--> +<!-- :label="item.label"--> +<!-- :value="item.value"--> +<!-- />--> +<!-- </el-select>--> + <el-cascader v-model="form.workDetail.operationDepId" :options="departList" :props="casProps" :show-all-levels="false" @change="handleChange" /> </el-form-item> </el-col> <el-col :span="12"> @@ -103,7 +113,7 @@ <el-upload accept="image/*" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='imgLimit' v-model:file-list="fileList" :http-request="upload" :action="uploadUrl" list-type="picture-card" :on-remove="handleRemove" :before-remove="beforeRemove" :before-upload="getUploadUrl"> <el-icon><Plus /></el-icon> <template #tip> - <div class="el-upload__tip">上传jpg/png图片尺寸小于500KB,最多可上传5张</div> + <div class="el-upload__tip">上传jpg/png图片尺寸小于500KB,最多可上传3张</div> </template> </el-upload> </el-form-item> @@ -142,7 +152,9 @@ uploadUrl: string, dialogVisible: Boolean, dialogImageUrl: string | null, - imgLimit: number + imgLimit: number, + casProps: {}, + isOverSize: Boolean } interface file { url: string; @@ -150,7 +162,7 @@ export default { name: 'groundForm', components: {}, - props:['workerList'], + props:['workerList','departList'], setup(props: any, context: any) { const userInfo = useUserInfo() const { userInfos } = storeToRefs(userInfo); @@ -161,6 +173,7 @@ workLevel: 0, workContent: '', workLocation: '', + hazardIdentification: '', workDetail:{ operationDepId: null, gbScope: '', @@ -172,8 +185,9 @@ expStartTime: '', expEndTime: '' }, + isOverSize: false, fileList: [], - imgLimit: 5, + imgLimit: 3, uploadUrl: '', dialogVisible: false, dialogImageUrl: null, @@ -236,7 +250,15 @@ label: '盲板抽堵作业', value: 8 } - ] + ], + casProps: { + emitPath: false, + value: 'depId', + label: 'depName', + multiple: false, + expandTrigger: 'hover', + checkStrictly: true + } }); const ruleFormRef = ref<FormInstance>() const applyRules = reactive<FormRules>({ @@ -244,6 +266,7 @@ workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workContent: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workLocation: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + hazardIdentification: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], workTimeLine: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], "workDetail.operationDepId": [{ required: true, message: '该内容不能为空', trigger: 'blur' }], "workDetail.gbScope": [{ required: true, message: '该内容不能为空', trigger: 'blur' }], @@ -290,10 +313,19 @@ }; const getUploadUrl = async (rawFile: any) => { - const res = await workApplyApi().getUploadUrl(rawFile.name); - state.form.workDetail.gbPath.push(res.data.data.fileName) - state.uploadUrl = res.data.data.uploadUrl; - console.log(res.data.data.fileName,'name') + const fileSize = rawFile.size / 1024 < 500 ? '1' : '0' + if(fileSize === '0'){ + ElMessage({ + type: 'warning', + message: '文件大小不能超过500k。' + }); + state.isOverSize = true + return false + }else{ + const res = await workApplyApi().getUploadUrl(rawFile.name); + state.form.workDetail.gbPath.push(res.data.data.fileName) + state.uploadUrl = res.data.data.uploadUrl; + } }; const upload = async (params: any) => { @@ -317,39 +349,50 @@ const beforeRemove = (file: {}, fileList: []) => { const result = new Promise((resolve, reject) => { - ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }) - .then(() => { - // console.log(state.workDetail.gbPath,'path') - const list = JSON.parse(JSON.stringify(state.form.workDetail.gbPath)) - fileList.map((item,index)=>{ - if(item.uid === file.uid){ - fileList.splice(index,1) - state.form.workDetail.gbPath.splice(index,1) - deletePic(list[index]) - } + if(!state.isOverSize){ + ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning' + }) + .then(() => { + // console.log(state.workDetail.gbPath,'path') + const list = JSON.parse(JSON.stringify(state.form.workDetail.gbPath)) + fileList.map((item,index)=>{ + if(item.uid === file.uid){ + fileList.splice(index,1) + state.form.workDetail.gbPath.splice(index,1) + // 请求删除接口 + deletePic(false,list[index]) + } + }) }) - // 请求删除接口 - }) - .catch(() => { - reject(false); - }); + .catch(() => { + reject(false); + }); + }else{ + const list = JSON.parse(JSON.stringify(state.form.workDetail.gbPath)) + fileList.map((item,index)=>{ + if(item.uid === file.uid){ + fileList.splice(index,1) + state.form.workDetail.gbPath.splice(index,1) + deletePic(true,list[index]) + } + }) + state.isOverSize = false + } }); return result; }; // 删除图片接口 - const deletePic = async(fileName)=>{ - console.log(fileName,'fileName') + const deletePic = async(isOverSize:boolean,fileName:string)=>{ const res = await workApplyApi().deleteFile({fileName: fileName}) if (res.data.code === '200') { ElMessage({ - type: 'success', - message: '删除成功!' + type: isOverSize ? 'error' : 'success', + message: isOverSize ? '上传失败':'删除成功!' }); } else { ElMessage({ @@ -438,7 +481,7 @@ .el-select{ width: 100%; } - .el-cascader{ + :deep(.el-cascader){ width: 100% !important; } } -- Gitblit v1.9.2