实验室资质页面迁移

gaoluyang

2025-02-14 84effa9b1ba6ec0f6d9779151cb3bb75182fa489

实验室资质页面迁移

 src/views/structural/laboratory/index.vue

@@ -2,7 +2,7 @@
  <div class="capacity-scope">
    <div>
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
        <el-form-item label="资质名称" prop="nickName">
        <el-form-item label="资质名称" prop="name">
          <el-select v-model="queryParams.name" placeholder="选择资质名称" size="small" @change="refreshTable()">
            <el-option v-for="dict in dict.type.qualification_name" :key="dict.value" :label="dict.label" :value="dict.value">
              {{ dict.label }}
@@ -70,53 +70,24 @@
      </div>
    </div>
    <el-dialog title="资质更新" :visible.sync="qualificationsConnectVisible" width="400px">
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px"><span class="required-span">* </span>资质名称：</div>
        <div class="search_input">
      <el-form ref="formDataRef" :model="formData" label-position="right" :rules="formDataRules" label-width="78px">
        <el-form-item label="资质名称" prop="name">
          <el-select v-model="formData.name" placeholder="请选择" style="width: 100%;" size="small" clearable>
            <el-option
              v-for="item in qualificationsList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            <el-option v-for="dict in dict.type.qualification_name" :key="dict.value" :label="dict.label" :value="dict.value">
              {{ dict.label }}
            </el-option>
          </el-select>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px"><span class="required-span">* </span>资质编码：</div>
        <div class="search_input">
          <el-input
            size="small"
            placeholder="请输入"
            clearable
            v-model="formData.code"></el-input>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px"><span class="required-span">* </span>颁发机构：</div>
        <div class="search_input">
          <el-input
            size="small"
            placeholder="请输入"
            clearable
            v-model="formData.organization"></el-input>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px">资质说明：</div>
        <div class="search_input">
          <el-input
            size="small"
            placeholder="请输入"
            clearable
            v-model="formData.explanation"></el-input>
        </div>
      </div>

      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px"><span class="required-span">* </span>颁发时间：</div>
        <div class="search_input">
        </el-form-item>
        <el-form-item label="资质编码" prop="code">
          <el-input size="small" placeholder="请输入" clearable v-model="formData.code"></el-input>
        </el-form-item>
        <el-form-item label="颁发机构" prop="organization">
          <el-input size="small" placeholder="请输入" clearable v-model="formData.organization"></el-input>
        </el-form-item>
        <el-form-item label="资质说明" prop="explanation">
          <el-input size="small" placeholder="请输入" clearable v-model="formData.explanation"></el-input>
        </el-form-item>
        <el-form-item label="颁发时间" prop="dateOfIssuance">
          <el-date-picker style="width:100%" v-model="formData.dateOfIssuance"
                          type="datetime"
                          size="small"
@@ -125,11 +96,8 @@
                          clearable
                          placeholder="选择日期">
          </el-date-picker>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px"><span class="required-span">* </span>到期时间：</div>
        <div class="search_input">
        </el-form-item>
        <el-form-item label="到期时间" prop="expireTime">
          <el-date-picker style="width:100%" v-model="formData.expireTime"
                          type="datetime"
                          size="small"
@@ -138,14 +106,11 @@
                          clearable
                          placeholder="选择日期">
          </el-date-picker>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px">资质图片：</div>
        <div class="search_input">
        </el-form-item>
        <el-form-item label="资质图片">
          <el-upload
            ref="upload"
            :action="action"
            :action="uploadAction"
            :on-success="m=>handleSuccessUpImg(m,'imageUrl')"
            accept='image/jpg,image/jpeg,image/png'
            :multiple="false"
@@ -154,21 +119,19 @@
            :on-error="onError">
            <el-button slot="trigger" size="small" type="primary">选取图片</el-button>
          </el-upload>
        </div>
      </div>
      <div class="search_thing" style="margin-bottom: 16px;">
        <div class="search_label" style="width:120px">资质附件：</div>
        <div class="search_input">
        </el-form-item>
        <el-form-item label="资质附件">
          <el-upload
            ref="upload1"
            :action="action"
            :action="uploadAction"
            :on-success="m=>handleSuccessUpImg(m,'fileUrl')"
            accept='image/jpg,image/jpeg,image/png,application/pdf,.doc,.docx' :headers="headers" :multiple="false" :limit="1" :on-change="beforeUpload1"
            accept='image/jpg,image/jpeg,image/png,application/pdf,.doc,.docx'
            :headers="headers" :multiple="false" :limit="1" :on-change="beforeUpload1"
            :on-error="onError1">
            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
          </el-upload>
        </div>
      </div>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
                <el-button @click="qualificationsConnectVisible = false">取 消</el-button>
                <el-button type="primary" @click="confirmQualifications" :loading="loading">确 定</el-button>
@@ -180,6 +143,7 @@
<script>
import limsTable from "@/components/Table/lims-table.vue";
import {addCertificationDetail, delCertificationDetail, getCertificationDetail} from "@/api/structural/laboratory";
import {getToken} from "@/utils/auth";

export default {
  components: {
@@ -226,6 +190,13 @@
      qualificationsList:[],
      qualificationsConnectVisible:false,
      formData:{},
      formDataRules: {
        name: [{ required: true, message: "请填写资质名称", trigger: "change" }],
        code: [{ required: true, message: "请填写资质编码", trigger: "blur" }],
        organization: [{ required: true, message: "请填写颁发机构", trigger: "blur" }],
        dateOfIssuance: [{ required: true, message: "请选择颁发时间", trigger: "change" }],
        expireTime: [{ required: true, message: "请填写到期时间", trigger: "change" }],
      },
      loading:false,
      pageLoading:false,
      isLoding: false, // 加载中，loading图标,默认为true
@@ -234,16 +205,8 @@
      pageSize: 16, // 一页16条
      total: '',
      list:[],
    }
  },
  computed: {
    headers() {
      return {
        'token': sessionStorage.getItem('token')
      }
    },
    action() {
      return ''
      uploadAction: process.env.VUE_APP_BASE_API + '/deviceScope/uploadFile',
      headers: { Authorization: "Bearer " + getToken() },
    }
  },
  mounted() {
@@ -384,37 +347,20 @@
      this.$refs.upload1.clearFiles()
    },
    confirmQualifications(){
      if(!this.formData.name){
        this.$message.error('未填写资质名称');
        return
      }
      if(!this.formData.code){
        this.$message.error('未填写资质编码');
        return
      }
      if(!this.formData.organization){
        this.$message.error('未填写颁发机构');
        return
      }
      if(!this.formData.expireTime){
        this.$message.error('未填写到期颁发时间');
        return
      }
      if(!this.formData.imageUrl){
        this.$message.error('未上传资质图片');
        return
      }
      if(!this.formData.fileUrl){
        this.$message.error('未上传资质附件');
        return
      }
      this.loading = true;
      addCertificationDetail({...this.formData}).then(res => {
        this.loading = false
        if (res.code === 201) return
        this.$message.success('已提交')
        this.refreshTable('page')
        this.qualificationsConnectVisible = false
      this.$refs['formDataRef'].validate((valid) => {
        if (valid) {
          this.loading = true;
          addCertificationDetail({...this.formData}).then(res => {
            this.loading = false
            if (res.code === 201) return
            this.$message.success('已提交')
            this.refreshTable()
            this.resetForm("formDataRef");
            this.qualificationsConnectVisible = false
          }).catch(err => {
            this.loading = false
          })
        }
      })
    },
    // 滚动触底加载