From bd19a941293d124d7c58c6d351e7e86c1fa15559 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期二, 26 十一月 2024 11:18:50 +0800
Subject: [PATCH] 新增数据上报修改

---
 src/views/dataUpload/saftyBaseInfo/parkingInfo/components/addReport.vue |  102 +++++++++++++++++++++++++++++++++++++++++++++++++-
 1 files changed, 99 insertions(+), 3 deletions(-)

diff --git a/src/views/dataUpload/saftyBaseInfo/parkingInfo/components/addReport.vue b/src/views/dataUpload/saftyBaseInfo/parkingInfo/components/addReport.vue
index a7e8dd1..4323d75 100644
--- a/src/views/dataUpload/saftyBaseInfo/parkingInfo/components/addReport.vue
+++ b/src/views/dataUpload/saftyBaseInfo/parkingInfo/components/addReport.vue
@@ -56,8 +56,29 @@
               <el-input v-model.trim="form.programme" placeholder="方案" clearable></el-input>
             </el-form-item>
           </el-col>
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+            <el-form-item label="附件">
+              <el-upload accept="image/*" multiple list-type="picture-card" :action="uploadUrl" :headers="header" method="post" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :on-success="handleAvatarSuccess" :limit='2' v-model:file-list="fileList" :before-upload="picSize" :on-remove="handleRemove" :before-remove="beforeRemove">
+                <el-icon><Plus /></el-icon>
+                <template #tip>
+                  <div class="el-upload__tip">上传图片尺寸小于2M,最多可上传2张</div>
+                </template>
+              </el-upload>
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" v-if="title == '新增上报'? false : true">
+            <el-form-item label="删除状态" prop="deleted">
+              <el-radio-group v-model="form.deleted">
+                <el-radio :label="0">未删除</el-radio>
+                <el-radio :label="1">已删除</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
         </el-row>
       </el-form>
+      <el-dialog v-model="imgDialog">
+        <img width="100%" :src="imageUrl" alt="Preview Image" />
+      </el-dialog>
       <template #footer>
         <span class="dialog-footer">
             <el-button @click="isShowDialog = !isShowDialog" size="default">取 消</el-button>
@@ -74,6 +95,7 @@
 import axios from "axios";
 import {workApplyApi} from "/@/api/specialWorkSystem/workApply";
 import {judgeReportApi} from "/@/api/dataUpload/saftyBaseInfo/judgeReport";
+import Cookies from "js-cookie";
 
 // 定义接口来定义对象的类型
 interface DataState {
@@ -91,8 +113,15 @@
     seq: string
     preparation: string
     programme: string
+    deleted: number | null
+    filePath: string
   }
   rules:{}
+  fileList: [],
+  uploadUrl: string,
+  header: {},
+  imgDialog: boolean,
+  imageUrl: string
 }
 
 export default defineComponent({
@@ -113,14 +142,24 @@
         craftName: '',
         seq: '',
         preparation: '',
-        programme: ''
+        programme: '',
+        deleted: 0,
+        filePath: ''
       },
       rules:{
         programmeName: [{ required: true, message: '请填写方案名称', trigger: 'blur' }],
         startTime: [{ required: true, message: '请选择开始时间', trigger: 'blur' }],
         endTime: [{ required: true, message: '请选择结束时间', trigger: 'blur' }],
         programmeType: [{ required: true, message: '请选择开停车类型', trigger: 'blur' }]
-      }
+      },
+      fileList: [],
+      uploadUrl: import.meta.env.VITE_API_URL + '/account/file/upload',
+      header: {
+        uid: Cookies.get('uid'),
+        Authorization: Cookies.get('token')
+      },
+      imgDialog: false,
+      imageUrl: ''
     })
 
     // 页面加载时
@@ -143,8 +182,11 @@
           craftName: '',
           seq: '',
           preparation: '',
-          programme: ''
+          programme: '',
+          deleted: 1,
+          filePath: ''
         }
+        state.fileList=[]
       }else{
         state.title = '重新上报';
         Object.keys(state.form).forEach(key => {
@@ -152,6 +194,16 @@
             state.form[key] = JSON.parse(JSON.stringify(data))[key];
           }
         })
+        if(data.filePath !== ''){
+          state.fileList = data.filePath.split(',').map((i,index) => {
+            return {
+              url:  i,
+              name: i
+            }
+          })
+        }else{
+          state.fileList=[]
+        }
         // state.form = {
         //   uuid: data.uuid,
         //   programmeName: '',
@@ -172,6 +224,7 @@
     const onSubmit = async () => {
       formRef.value.validate(async (valid:Boolean) => {
         if(valid){
+          state.form.filePath = state.fileList.map(i=>i.name).join(',')
           const res = await judgeReportApi().addParking([state.form])
           if(res.data.code == 200){
             ElMessage({
@@ -195,10 +248,53 @@
       })
     }
 
+    // 图片上传
+    const showTip =()=>{
+      ElMessage({
+        type: 'warning',
+        message: '超出文件上传数量'
+      });
+    }
+
+    const picSize = async(rawFile: any) => {
+      if(rawFile.size / 1024 / 1024 > 2){
+        ElMessage({
+          type: 'warning',
+          message: '文件大小不能超过2M'
+        });
+        return false
+      }
+    }
+
+    const handleAvatarSuccess = (res:any, uploadFile: any) => {
+      if(res){
+        uploadFile.name = res
+      }else{
+        ElMessage({
+          type: 'warning',
+          message: '文件上传失败'
+        })
+      }
+    }
+
+    const handlePictureCardPreview = (uploadFile) => {
+      state.imageUrl = uploadFile.url
+      state.imgDialog = true;
+    }
+
+    const handleRemove = (file, uploadFiles,type) => {
+      state.fileList = uploadFiles
+    }
+
 
     return {
       formRef,
       open,
+      showTip,
+      picSize,
+      handleAvatarSuccess,
+      handlePictureCardPreview,
+      handleRemove,
       onSubmit,
       ...toRefs(state)
     };

--
Gitblit v1.9.2