| | |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="作业时间" prop="workTimeLine"> |
| | | <el-date-picker |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | </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-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> |
| | |
| | | dialogImageUrl: string | null, |
| | | imgLimit: number, |
| | | casProps: {}, |
| | | casProps2: {} |
| | | casProps2: {}, |
| | | isOverSize: boolean |
| | | } |
| | | interface file { |
| | | url: string; |
| | |
| | | workLevel: 0, |
| | | workContent: '', |
| | | workLocation: '', |
| | | hazardIdentification: '', |
| | | workDetail:{ |
| | | operationDepId: null, |
| | | bcReason: '', |
| | |
| | | expStartTime: '', |
| | | expEndTime: '' |
| | | }, |
| | | isOverSize: false, |
| | | fileList: [], |
| | | imgLimit: 5, |
| | | imgLimit: 3, |
| | | uploadUrl: '', |
| | | dialogVisible: false, |
| | | dialogImageUrl: null, |
| | |
| | | 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.bcReason": [{ required: true, message: '该内容不能为空', trigger: 'blur' }], |
| | |
| | | }; |
| | | |
| | | const getUploadUrl = async (rawFile: any) => { |
| | | const res = await workApplyApi().getUploadUrl(rawFile.name); |
| | | state.form.workDetail.bcPath.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.bcPath.push(res.data.data.fileName) |
| | | state.uploadUrl = res.data.data.uploadUrl; |
| | | console.log(res.data.data.fileName,'name') |
| | | } |
| | | }; |
| | | |
| | | const upload = async (params: any) => { |
| | |
| | | |
| | | const beforeRemove = (file: {}, fileList: []) => { |
| | | const result = new Promise((resolve, reject) => { |
| | | ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(() => { |
| | | // console.log(state.workDetail.bcPath,'path') |
| | | const list = JSON.parse(JSON.stringify(state.form.workDetail.bcPath)) |
| | | fileList.map((item,index)=>{ |
| | | if(item.uid === file.uid){ |
| | | fileList.splice(index,1) |
| | | state.form.workDetail.bcPath.splice(index,1) |
| | | deletePic(list[index]) |
| | | } |
| | | if(!state.isOverSize){ |
| | | ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(() => { |
| | | // console.log(state.workDetail.bcPath,'path') |
| | | const list = JSON.parse(JSON.stringify(state.form.workDetail.bcPath)) |
| | | fileList.map((item,index)=>{ |
| | | if(item.uid === file.uid){ |
| | | fileList.splice(index,1) |
| | | state.form.workDetail.bcPath.splice(index,1) |
| | | deletePic(false,list[index]) |
| | | } |
| | | }) |
| | | // 请求删除接口 |
| | | }) |
| | | // 请求删除接口 |
| | | }) |
| | | .catch(() => { |
| | | reject(false); |
| | | }); |
| | | .catch(() => { |
| | | reject(false); |
| | | }); |
| | | }else{ |
| | | const list = JSON.parse(JSON.stringify(state.form.workDetail.bcPath)) |
| | | fileList.map((item,index)=>{ |
| | | if(item.uid === file.uid){ |
| | | fileList.splice(index,1) |
| | | state.form.workDetail.bcPath.splice(index,1) |
| | | deletePic(true,list[index]) |
| | | } |
| | | }) |
| | | state.isOverSize = false |
| | | } |
| | | }); |
| | | return result; |
| | | }; |
| | | |
| | | |
| | | // 删除图片接口 |
| | | const deletePic = async(fileName)=>{ |
| | | const deletePic = async(isOverSize:boolean,fileName:string)=>{ |
| | | console.log(fileName,'fileName') |
| | | const res = await workApplyApi().deleteFile({fileName: fileName}) |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | type: isOverSize ? 'error' : 'success', |
| | | message: isOverSize ? '上传失败':'删除成功!' |
| | | }); |
| | | } else { |
| | | ElMessage({ |
| | |
| | | .el-select{ |
| | | width: 100%; |
| | | } |
| | | .el-cascader{ |
| | | :deep(.el-cascader){ |
| | | width: 100% !important; |
| | | } |
| | | } |