新增数据上报修改

马宇豪

2024-11-26 bd19a941293d124d7c58c6d351e7e86c1fa15559

 src/views/dataUpload/saftyBaseInfo/cardInfo/components/addReport.vue

@@ -9,8 +9,20 @@
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="分类名称" prop="cateName">
            <el-form-item label="分类名称">
              <el-input v-model.trim="form.cateName" 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="分类标识" prop="cateType">
              <el-select v-model="form.cateType" style="width: 100%">
                <el-option
                    v-for="item in typeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
@@ -38,6 +50,24 @@
              <el-input v-model.trim="form.notifyUser" 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>
      <template #footer>
@@ -56,6 +86,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 {
@@ -70,8 +101,17 @@
    effectiveTime: string
    dueTime: string
    notifyUser: string
    cateType: string
    deleted: number | null
    files: string
  }
  rules:{}
  typeList: Array<any>
  fileList: [],
  uploadUrl: string,
  header: {},
  imgDialog: boolean,
  imageUrl: string
}

export default defineComponent({
@@ -89,14 +129,26 @@
        pusTime: '',
        effectiveTime: '',
        dueTime: '',
        notifyUser: ''
        notifyUser: '',
        cateType: '',
        deleted: 0,
        files: ''
      },
      typeList:[],
      rules:{
        name: [{ required: true, message: '请填写证书名称', trigger: 'blur' }],
        cateName: [{ required: true, message: '请填写分类名称', trigger: 'blur' }],
        cateType: [{ required: true, message: '请选择分类标识', trigger: 'blur' }],
        orgName: [{ required: true, message: '请填写发证机构', trigger: 'blur' }],
        notifyUser: [{ 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: ''
    })

    // 页面加载时
@@ -104,8 +156,9 @@

    })
    // 打开弹窗
    const open = (type: string, data: object) => {
    const open = (type: string, data: object,cateTypeList: Array<any>) => {
      state.isShowDialog = true;
      state.typeList = cateTypeList
      if (type === 'add') {
        state.title = '新增上报';
        state.form = {
@@ -116,7 +169,10 @@
          pusTime: '',
          effectiveTime: '',
          dueTime: '',
          notifyUser: ''
          notifyUser: '',
          cateType: '',
          deleted: 0,
          files: ''
        }
      }else{
        state.title = '重新上报'
@@ -125,6 +181,16 @@
            state.form[key] = JSON.parse(JSON.stringify(data))[key];
          }
        })
        if(data.files !== ''){
          state.fileList = data.files.split(',').map((i,index) => {
            return {
              url:  i,
              name: i
            }
          })
        }else{
          state.fileList=[]
        }
        // state.form = {
        //   uuid: data.uuid,
        //   name: '',
@@ -142,6 +208,7 @@
    const onSubmit = async () => {
      formRef.value.validate(async (valid:Boolean) => {
        if(valid){
          state.form.files = state.fileList.map(i=>i.name).join(',')
          const res = await judgeReportApi().addCard([state.form])
          if(res.data.code == 200){
            ElMessage({
@@ -165,9 +232,51 @@
      })
    }

    // 图片上传
    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,
      showTip,
      picSize,
      handleAvatarSuccess,
      handlePictureCardPreview,
      handleRemove,
      open,
      onSubmit,
      ...toRefs(state)