马宇豪
2023-07-13 01f3e49f3763a25ef67a4c3e5786491703a1aece
src/views/specialWorkSystem/process/zyjcgl/index.vue
@@ -50,11 +50,11 @@
                  <el-table-column property="info" label="描述" show-overflow-tooltip width="200" align="center"/>
                  <el-table-column property="operatorUname" label="分析人" align="center"/>
                  <el-table-column property="operationTime" label="分析时间" width="180" align="center"/>
            <el-table-column property="mcResultName" label="物资检查" width="180" align="center">
              <template #default="scope">
                <span :class="scope.row.mcResultName == '不合格' ? 'red': ''">{{ scope.row.mcResultName== null?'-':scope.row.mcResultName}}</span>
              </template>
            </el-table-column>
<!--            <el-table-column property="mcResultName" label="物资检查" width="180" align="center">-->
<!--              <template #default="scope">-->
<!--                <span :class="scope.row.mcResultName == '不合格' ? 'red': ''">{{ scope.row.mcResultName== null?'-':scope.row.mcResultName}}</span>-->
<!--              </template>-->
<!--            </el-table-column>-->
                  <el-table-column fixed="right" label="操作" align="center" width="100">
                     <template #default="scope">
                        <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
@@ -92,7 +92,8 @@
               <el-input :class="details.checkResultDesc == '异常' ? 'red': ''" v-model="details.checkResultDesc" readonly/>
            </el-form-item>
            <el-form-item label="现场图片" v-if="details.imagePaths && details.imagePaths.length>0">
               <el-image v-for="item in details.imagePaths" :preview-src-list="details.imagePaths" style="width: 150px; height: 150px;margin-right: 50px;margin-bottom: 20px" :src="item" fit="cover" />
<!--               <el-image v-for="item in details.imagePaths" :preview-src-list="details.imagePaths" style="width: 150px; height: 150px;margin-right: 50px;margin-bottom: 20px" :src="item" fit="cover" />-->
          <el-image v-for="item in details.imagePaths" :preview-src-list="[item]" style="width: 150px; height: 150px;margin-right: 50px;margin-bottom: 20px" :src="item" fit="cover" />
            </el-form-item>
            <el-form-item label="描述">
               <el-input v-model="details.info" type="textarea" readonly/>
@@ -103,9 +104,9 @@
            <el-form-item label="分析时间">
               <el-input v-model="details.operationTime" readonly/>
            </el-form-item>
        <el-form-item label="物资检查">
          <span>{{details.mcResultName== null?'-':details.mcResultName}}</span>
        </el-form-item>
<!--        <el-form-item label="物资检查">-->
<!--          <span>{{details.mcResultName== null?'-':details.mcResultName}}</span>-->
<!--        </el-form-item>-->
         </el-form>
         <template #footer>
           <span class="dialog-footer">
@@ -116,10 +117,10 @@
      <el-dialog v-model="dialogAddRecord" title="新增" @close="closeAdd" @open="openAdd">
         <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules">
            <el-form-item label="作业证编号" prop="workPermitNo">
               <el-input v-model="addRecord.workPermitNo" placeholder="作业编号须为已审批作业的编号,可点击右方按钮查询">
                  <template #append>
                     <el-button :icon="Search" @click="dialogPermitNo = true"/>
                  </template>
               <el-input v-model="addRecord.workPermitNo" placeholder="点击选择已审批作业" @click="dialogPermitNo = true" readonly>
<!--                  <template #append>-->
<!--                     <el-button :icon="Search" @click="dialogPermitNo = true"/>-->
<!--                  </template>-->
               </el-input>
            </el-form-item>
            <el-form-item label="作业类型" prop="workType">
@@ -142,10 +143,10 @@
               </el-select>
            </el-form-item>
            <el-form-item label="现场照片" prop="imagePaths">
               <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-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" :before-remove="beforeRemove" :before-upload="getUploadUrl">
                  <el-icon><Plus /></el-icon>
                  <template #tip>
                     <div class="el-upload__tip">上传jpg/png图片尺寸小于500KB,最多可上传3张</div>
                     <div class="el-upload__tip">上传jpg/png图片尺寸小于2M,最多可上传3张</div>
                  </template>
               </el-upload>
            </el-form-item>
@@ -163,7 +164,7 @@
      <el-dialog v-model="dialogVisible">
         <img w-full :src="dialogImageUrl" alt="Preview Image" />
      </el-dialog>
      <el-dialog v-model="dialogPermitNo" title="选择相应的作业编号">
      <el-dialog v-model="dialogPermitNo" title="选择相应的作业编号" @close="resetForm()">
         <permit-no ref="permitNoInfo"></permit-no>
         <template #footer>
           <span class="dialog-footer">
@@ -195,7 +196,6 @@
      imgLimit: number;
      fileList: Array<file>,
      uploadUrl: string,
      isOverSize: Boolean,
      dialogVisible: Boolean,
      dialogImageUrl: string | null,
      multipleSelection: Array<any>;
@@ -235,7 +235,6 @@
            chosenIndex: null,
            workPermitNo: '',
            workType: null,
            isOverSize: false,
            fileList: [],
            imgLimit: 3,
            uploadUrl: '',
@@ -273,7 +272,7 @@
         const addRef = ref<FormInstance>();
         const addRules = reactive<FormRules>({
            workPermitNo: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            workPermitNo: [{ required: true, message: '该内容不能为空', trigger: 'change' }],
            workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            checkContent: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            checkResult: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
@@ -329,19 +328,17 @@
         };
         const getUploadUrl = async (rawFile: any) => {
            const fileSize = rawFile.size / 1024 < 500 ? '1' : '0'
            if(fileSize === '0'){
            // const fileSize = rawFile.size / 1024 < 500 ? '1' : '0'
            if(rawFile.size / 1024 / 1024 > 2){
               ElMessage({
                  type: 'warning',
                  message: '文件大小不能超过500k。'
                  message: '文件大小不能超过2M。'
               });
               state.isOverSize = true
               return false
          return Promise.reject(false)
            }else{
               const res = await workApplyApi().getUploadUrl(rawFile.name);
               const res = await workApplyApi().getUpload9Url(rawFile.name);
               state.addRecord.imagePaths.push(res.data.data.fileName)
               state.uploadUrl = res.data.data.uploadUrl;
               console.log(state.addRecord.imagePaths,state.uploadUrl,6666666666666)
            }
         };
@@ -365,50 +362,40 @@
         };
         const beforeRemove = (file: {}, fileList: []) => {
            const result = new Promise((resolve, reject) => {
               if(!state.isOverSize){
                  ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', {
                     confirmButtonText: '确定',
                     cancelButtonText: '取消',
                     type: 'warning'
                  })
                        .then(() => {
                           // console.log(state.workDetail.photos,'path')
                           const list = JSON.parse(JSON.stringify(state.addRecord.imagePaths))
                           fileList.map((item,index)=>{
                              if(item.uid === file.uid){
                                 fileList.splice(index,1)
                                 state.addRecord.photos.splice(index,1)
                                 // 请求删除接口
                                 deletePic(false,list[index])
                              }
                           })
                        })
                        .catch(() => {
                           reject(false);
                        });
               }else{
                  const list = JSON.parse(JSON.stringify(state.addRecord.imagePaths))
                  fileList.map((item,index)=>{
                     if(item.uid === file.uid){
                        fileList.splice(index,1)
                        state.addRecord.photos.splice(index,1)
                        deletePic(true,list[index])
                     }
                  })
                  state.isOverSize = false
               }
            });
            return result;
        if (file && file.status === "success") {
          const result = new Promise((resolve, reject) => {
            ElMessageBox.confirm('此操作将删除该图片, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            })
                .then(() => {
                  // console.log(state.workDetail.photos,'path')
                  const list = JSON.parse(JSON.stringify(state.addRecord.imagePaths))
                  fileList.map((item, index) => {
                    if (item.uid === file.uid) {
                      fileList.splice(index, 1)
                      state.addRecord.imagePaths.splice(index, 1)
                      // 请求删除接口
                      deletePic(list[index])
                    }
                  })
                })
                .catch(() => {
                  reject(false);
                });
          });
          return result;
        }
         };
         // 删除图片接口
         const deletePic = async(isOverSize:boolean,fileName:string)=>{
         const deletePic = async(fileName:string)=>{
            const res = await workApplyApi().deleteFile({fileName: fileName})
            if (res.data.code === '200') {
               ElMessage({
                  type: isOverSize ? 'error' : 'success',
                  message: isOverSize ? '上传失败':'删除成功!'
                  type: 'success',
                  message: '删除成功!'
               });
            } else {
               ElMessage({
@@ -463,12 +450,25 @@
               if (valid) {
                  await addRecord(state.addRecord);
                  state.dialogAddRecord = false;
            state.fileList = []
                  getListByPage();
               } else {
                  console.log('error submit!', fields);
               }
            });
         };
      const resetForm = () =>{
        state.addRecord={
          workPermitNo: '',
          checkContent: '',
          checkResult: '',
          info: '',
          source: 2,
          imagePaths: []
        }
        state.fileList = []
      }
         const handleSizeChange = (val: number) => {
            state.pageSize = val;
@@ -493,6 +493,7 @@
         const closeAdd = () => {
            state.addRecord = {};
            state.chosenIndex = null;
        resetForm()
         };
         const openAdd = () => {
@@ -538,6 +539,7 @@
            closeAdd,
            openAdd,
            indexClear,
        resetForm,
            ...toRefs(state)
         };
      }