场所或设施+实验室资质搬迁

spring

2025-03-06 f076107b1adc84c80522b4320a41e7cf0a1c9c5f

场所或设施+实验室资质搬迁

 src/api/structural/laboratory.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,26 @@
import request from "@/utils/request";

// æŸ¥è¯¢èµ„质明细列表
export function getCertificationDetail(query) {
  return request({
    url: "/certification/getCertificationDetail",
    method: "get",
    params: query,
  });
}
// æ·»åŠ èµ„质明细列表
export function addCertificationDetail(query) {
  return request({
    url: "/certification/addCertificationDetail",
    method: "post",
    data: query,
  });
}
// åˆ é™¤èµ„质明细列表
export function delCertificationDetail(query) {
  return request({
    url: "/certification/delCertificationDetail",
    method: "delete",
    params: query,
  });
}

 src/api/structural/laboratoryScope.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,65 @@
import request from "@/utils/request";

// èŽ·å–实验室名称
export function obtainItemParameterList() {
  return request({
    url: "/laboratoryScope/obtainItemParameterList",
    method: "get",
  });
}
// æŸ¥è¯¢å®žéªŒå®¤ç®¡ç†åˆ—表
export function selectItemParameter(query) {
  return request({
    url: "/laboratoryScope/selectItemParameter",
    method: "get",
    params: query,
  });
}
// æ·»åŠ å®žéªŒå®¤å‚æ•°
export function addParameter(query) {
  return request({
    url: "/laboratoryScope/addParameter",
    method: "post",
    data: query,
  });
}
// ä¿®æ”¹å®žéªŒå®¤å‚æ•°
export function upParameter(query) {
  return request({
    url: "/laboratoryScope/upParameter",
    method: "post",
    data: query,
  });
}
// åˆ é™¤å®žéªŒå®¤å‚æ•°
export function delParameter(query) {
  return request({
    url: "/laboratoryScope/delParameter",
    method: "delete",
    params: query,
  });
}
// æŸ¥è¯¢å°ç« åˆ—表
export function selectSeal(query) {
  return request({
    url: "/sealScope/selectSeal",
    method: "get",
    params: query,
  });
}
// æŸ¥è¯¢å°ç« åˆ—表
export function addSeal(query) {
  return request({
    url: "/sealScope/addSeal",
    method: "post",
    data: query,
  });
}
// æŸ¥è¯¢èµ„质明细列表
export function getCertificationDetail(query) {
  return request({
    url: "/certification/getCertificationDetail",
    method: "get",
    params: query,
  });
}

 src/assets/styles/variables.scss

@@ -1,25 +1,25 @@
// base color
$blue:#324157;
$light-blue:#3A71A8;
$red:#C03639;
$pink: #E65D6E;
$green: #30B08F;
$tiffany: #4AB7BD;
$yellow:#FEC171;
$panGreen: #30B08F;
$blue: #324157;
$light-blue: #3a71a8;
$red: #c03639;
$pink: #e65d6e;
$green: #30b08f;
$tiffany: #4ab7bd;
$yellow: #fec171;
$panGreen: #30b08f;

// é»˜è®¤èœå•ä¸»é¢˜é£Žæ ¼
$base-menu-color:#bfcbd9;
$base-menu-color-active:#ffffff;
$base-menu-background:#1890FF;
$base-menu-color: #bfcbd9;
$base-menu-color-active: #ffffff;
$base-menu-background: #3a7bfa;
$base-logo-title-color: #ffffff;

$base-menu-light-color:#ffffff;
$base-menu-light-background:#1890FF;
$base-menu-light-color: #ffffff;
$base-menu-light-background: #3a7bfa;
$base-logo-light-title-color: #606266;

$base-sub-menu-background:#ffffff;
$base-sub-menu-hover:#001528;
$base-sub-menu-background: #ffffff;
$base-sub-menu-hover: #001528;

// è‡ªå®šä¹‰æš—色菜单风格
/**
@@ -50,5 +50,5 @@
  subMenuHover: $base-sub-menu-hover;
  sideBarWidth: $base-sidebar-width;
  logoTitleColor: $base-logo-title-color;
  logoLightTitleColor: $base-logo-light-title-color
  logoLightTitleColor: $base-logo-light-title-color;
}

 src/views/structural/capabilityAndLaboratory/laboratory/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,455 @@
<template>
  <div class="capacity-scope">
    <div>
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
        <el-form-item label="资质名称" prop="name">
          <el-select v-model="queryParams.name" placeholder="选择资质名称" size="small" @change="refreshTable(), list = []">
            <el-option v-for="dict in dict.type.cnas_method_qualification" :key="dict.value" :label="dict.label"
              :value="dict.value">
              {{ dict.label }}
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="refreshTable">查 è¯¢</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="refresh">重 ç½®</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div>
      <el-row class="title">
        <el-col :span="12" style="text-align: left">
          <el-radio-group v-model="radio" @input="selectorSwitch" size="medium" fill="#409EFF">
            <el-radio-button :label="0">资质明细</el-radio-button>
            <el-radio-button :label="1">资质总览</el-radio-button>
          </el-radio-group>
        </el-col>
        <el-col :span="12" style="text-align: right" v-if="radio === 0">
          <el-button size="small" type="primary" @click="openAdd">资质更新</el-button>
          <el-button size="small" icon="el-icon-delete" @click="handleDel">删除</el-button>
        </el-col>
      </el-row>
    </div>
    <div v-if="radio === 0">
      <lims-table :tableData="tableData" :column="column" :isSelection="true"
        :handleSelectionChange="handleSelectionChange" @pagination="pagination" :height="'calc(100vh - 300px)'"
        :page="page" :tableLoading="tableLoading"></lims-table>
    </div>
    <div class="table" v-if="radio === 1" v-loading="pageLoading" @scroll="scrollFn">
      <el-row :gutter="16">
        <el-col :span="8" v-for="(m, i) in list" :key="i" :xs="24" :sm="12" :md="8" :lg="8" :xl="6"
          style="margin-bottom: 16px">
          <div class="table-item">
            <el-image style="
                width: 102px;
                height: 102px;
                margin-right: 20px;
                border-radius: 16px;
              " :src="javaApi + '/img/' + m.imageUrl">
              <div slot="error" class="image-error" style="
                  width: 100px;
                  height: 100px;
                  border-radius: 16px;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  border: 1px solid #eeeeee;
                ">
                <i class="el-icon-picture-outline" style="font-size: 30px; color: #666666"></i>
              </div>
            </el-image>
            <div class="table-item-right" style="flex: 1; font-size: 12px; color: #666666">
              <p style="line-height: 26px">
                èµ„质名称：<span style="color: #3a7bfa">{{ m.name }}</span>
              </p>
              <p style="line-height: 26px">颁发时间：{{ m.recentlyTime }}</p>
              <p style="line-height: 26px">到期时间：{{ m.expireTime }}</p>
              <p>
                <span>状态：</span>
                <el-tag :type="m.state === 0 ? 'danger' : 'success'" size="small">{{ m.state === 0 ? "失效" : "有效"
                  }}</el-tag>
              </p>
            </div>
          </div>
        </el-col>
      </el-row>
      <div v-if="list.length < 1 && !pageLoading && !isLoding" style="
          color: #909399;
          font-size: 14px;
          text-align: center;
          margin-top: 200px;
        ">
        æš‚无数据
      </div>
      <div v-if="list.length > 0">
        <el-button v-if="isLoding" type="text" style="display: flex; margin: 0 auto; color: #909399">
          <i class="el-icon-loading" style="font-size: 20px"></i>
        </el-button>
        <el-button type="text" v-if="finishLoding"
          style="display: flex; margin: 0 auto; color: #909399">已经没有更多啦~</el-button>
      </div>
    </div>
    <el-dialog title="资质更新" :visible.sync="qualificationsConnectVisible" width="400px">
      <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="dict in dict.type.cnas_method_qualification" :key="dict.value" :label="dict.label"
              :value="dict.value">
              {{ dict.label }}
            </el-option>
          </el-select>
        </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"
            format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" clearable placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="到期时间" prop="expireTime">
          <el-date-picker style="width: 100%" v-model="formData.expireTime" type="datetime" size="small"
            format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" clearable placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="资质图片">
          <el-upload ref="upload" :action="uploadAction" :on-success="(m) => handleSuccessUpImg(m, 'imageUrl')"
            accept="image/jpg,image/jpeg,image/png" :multiple="false" :limit="1" :headers="headers"
            :on-change="beforeUpload" :on-error="onError">
            <el-button slot="trigger" size="small" type="primary">选取图片</el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label="资质附件">
          <el-upload ref="upload1" :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" :on-error="onError1">
            <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
          </el-upload>
        </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>
      </span>
    </el-dialog>
  </div>
</template>

<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: {
    limsTable,
  },
  dicts: ["cnas_method_qualification"],
  data() {
    return {
      radio: 0,
      queryParams: {
        name: "",
      },
      tableData: [],
      selection: [],
      column: [
        { label: "资质名称", prop: "name" },
        { label: "资质编码", prop: "code" },
        { label: "颁发机构", prop: "organization" },
        { label: "资质说明", prop: "explanation" },
        { label: "首次颁发时间", prop: "firstIssuanceDate" },
        { label: "最近颁发时间", prop: "latestIssuanceDate" },
        { label: "到期颁发时间", prop: "expireTime" },
        {
          dataType: "action",
          fixed: "right",
          label: "操作",
          operation: [
            {
              name: "附件下载",
              type: "text",
              clickFun: (row) => {
                this.handleDownLoad(row);
              },
            },
          ],
        },
      ],
      page: {
        total: 0,
        size: 10,
        current: 1,
      },
      tableLoading: false,
      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
      finishLoding: false, // åŠ è½½å®Œæˆï¼Œæ˜¾ç¤ºå·²ç»æ²¡æœ‰æ›´å¤šäº†
      currentPage: 1, // å½“前页
      pageSize: 16, // ä¸€é¡µ16条
      total: "",
      list: [],
      uploadAction: process.env.VUE_APP_BASE_API + "/deviceScope/uploadFile",
      headers: { Authorization: "Bearer " + getToken() },
    };
  },
  mounted() {
    this.refreshTable();
  },
  methods: {
    selectorSwitch(radio) {
      if (radio === 1) {
        this.list = [];
        this.refreshTable();
      }
    },
    refreshTable() {
      if (this.radio === 0) {
        this.tableLoading = true;
        getCertificationDetail({ ...this.page, ...this.queryParams })
          .then((res) => {
            this.tableLoading = false;
            if (res.code === 200) {
              this.tableData = res.data.records;
              this.page.total = res.data.total;
            }
          })
          .catch((err) => {
            this.tableLoading = false;
          });
      } else {
        if (this.currentPage > 1) {
          this.isLoding = true;
        } else {
          this.pageLoading = true;
        }
        if (this.list.length === 0) {
          window.addEventListener(
            "scroll",
            this.throttle(this.scrollFn, 20000)
          );
        }
        getCertificationDetail({
          current: this.currentPage,
          size: this.pageSize,
          ...this.queryParams,
        })
          .then((res) => {
            if (res.code === 200) {
              this.total = res.data.total;
              let list = res.data.records;
              if (list.length === 0) {
                this.finishLoding = true;
              } else {
                if (list.length < this.pageSize) {
                  this.finishLoding = true;
                }
                this.list = this.list.concat(list);
                if (this.total === this.list.length) {
                  this.finishLoding = true;
                }
              }
            }
            this.pageLoading = false;
            this.isLoding = false;
          })
          .catch((err) => {
            this.pageLoading = false;
            this.isLoding = false;
          });
      }
    },
    // é‡ç½®
    refresh() {
      if (this.radio === 0) {
        this.queryParams.name = "";
        this.page.size = 10;
        this.page.current = 1;
        this.refreshTable();
      } else {
        this.finishLoding = false;
        this.currentPage = 1;
        this.list = [];
        this.refreshTable();
      }
    },
    // è¡¨æ ¼å¤šé€‰
    handleSelectionChange(selection) {
      this.selection = selection;
    },
    pagination(page) {
      this.page.size = page.limit;
      this.refreshTable();
    },
    // èµ„质明细批量删除
    handleDel() {
      if (this.selection.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      const delIds = [];
      this.selection.forEach((item) => {
        delIds.push(item.id);
      });
      delCertificationDetail({ ids: delIds.join(',') }).then((res) => {
        if (res.code !== 200) return;
        this.refreshTable();
        this.$message.success("删除成功");
      });
    },
    // èµ„质明细附件下载
    handleDownLoad(row) {
      const url = process.env.VUE_APP_BASE_API + "/img/" + row.fileUrl;
      this.$download.saveAs(url, row.fileUrl);
    },
    openAdd() {
      this.qualificationsConnectVisible = true;
      this.$nextTick(() => {
        this.$refs.upload.clearFiles();
        this.$refs.upload1.clearFiles();
      });
      this.formData = {};
    },
    handleSuccessUpImg(response, name) {
      if (response.code === 200) {
        this.formData[name] = response.data.url;
      }
    },
    beforeUpload(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error("上传文件不超过10M");
        this.$refs.upload.clearFiles();
        return false;
      } else {
        return true;
      }
    },
    onError(err, file, fileList) {
      this.$message.error("上传失败");
      this.$refs.upload.clearFiles();
    },
    beforeUpload1(file) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error("上传文件不超过10M");
        this.$refs.upload1.clearFiles();
        return false;
      } else {
        return true;
      }
    },
    onError1(err, file, fileList) {
      this.$message.error("上传失败");
      this.$refs.upload1.clearFiles();
    },
    confirmQualifications() {
      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;
            });
        }
      });
    },
    // æ»šåŠ¨è§¦åº•åŠ è½½
    scrollFn() {
      let clientHeight = document.documentElement.clientHeight - 18; //可视区域
      let scrollHeight = document.body.scrollHeight; // æ»šåŠ¨æ–‡æ¡£é«˜åº¦
      let scrollTop = parseInt(document.documentElement.scrollTop); // å·²æ»šåŠ¨çš„高度
      let height = 300;
      if (
        scrollTop + clientHeight >= scrollHeight - height &&
        scrollHeight !== 0
      ) {
        if (
          !this.finishLoding &&
          this.currentPage * this.pageSize < this.total
        ) {
          this.currentPage = this.currentPage + 1;
          this.refreshTable();
        }
      } else {
        return false;
      }
    },
    throttle(fn, wait) {
      // å°è£…函数进行节流
      var timer = null;
      return function () {
        var context = this;
        var args = arguments;
        if (!timer) {
          timer = setTimeout(function () {
            fn.apply(context, args);
            timer = null;
          }, wait);
        }
      };
    },
  },
  destroyed() {
    window.removeEventListener("scroll", this.throttle(), false);
  },
};
</script>

<style scoped>
.capacity-scope {
  padding: 20px;
}

.title {
  height: 40px;
  line-height: 40px;
  margin-bottom: 10px;
}

.table-item {
  border-radius: 8px 8px 8px 8px;
  box-shadow: 4px 4px 8px 0px rgba(51, 51, 51, 0.04);
  border: 1px solid #eeeeee;
  box-sizing: border-box;
  padding: 14px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
</style>

 src/views/structural/premises/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,421 @@
<template>
  <div class="capacity-scope">
    <div class="search">
      <div>
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
          <el-form-item label="实验室名称" prop="laboratoryName">
            <el-input size="small" placeholder="请输入" clearable v-model="queryParams.laboratoryName"
              @keyup.enter.native="refreshTable"></el-input>
          </el-form-item>
          <el-form-item label="实验室编码" prop="laboratoryNumber">
            <el-input size="small" placeholder="请输入" clearable v-model="queryParams.laboratoryNumber"
              @keyup.enter.native="refreshTable"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="refreshTable">查 è¯¢</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="refresh">重 ç½®</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div>
        <el-button size="small" type="primary" @click="openAdd('add')" icon="el-icon-plus">新增</el-button>
      </div>
    </div>
    <div class="table">
      <lims-table :tableData="tableData" :column="column" :height="'calc(100vh - 250px)'" @pagination="pagination"
        :page="page" :tableLoading="tableLoading"></lims-table>
    </div>
    <!--    æ–°å¢žå®žéªŒå®¤-->
    <el-dialog :title="formTitle" :visible.sync="addDia" width="450px">
      <el-form ref="laboratoryForm" :model="laboratoryForm" :rules="userRules" label-position="right"
        label-width="100px">
        <el-form-item label="实验室名称" prop="laboratoryName">
          <el-input v-model="laboratoryForm.laboratoryName" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="场所编码" prop="laboratoryNumber">
          <el-input v-model="laboratoryForm.laboratoryNumber" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="实验室代号" prop="laboratoryCode">
          <el-input v-model="laboratoryForm.laboratoryCode" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="负责人" prop="head">
          <el-input v-model="laboratoryForm.head" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="负责人电话" prop="phoneNumber">
          <el-input v-model="laboratoryForm.phoneNumber" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="地址" prop="address">
          <el-input v-model="laboratoryForm.address" size="small" clearable></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="reset">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="customAdd" :loading="loading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
    <el-dialog title="印章管理" :visible.sync="fileVisible" width="60vw">
      <div class="btns">
        <el-button size="medium" type="primary" @click="openUpload">更新印章</el-button>
      </div>
      <lims-table :tableData="fileComponentData" :column="fileComponentDataColumn" @pagination="fileComponentPagination"
        height="500px" :page="fileComponentPage" :tableLoading="fileComponentTableLoading"></lims-table>
    </el-dialog>
    <el-dialog title="更新印章" :visible.sync="upFileVisible" width="400px">
      <el-form ref="dataForm" :model="dataForm" :rules="dataFormRules" label-position="right" label-width="80px">
        <el-form-item label="印章类型" prop="type">
          <el-cascader v-model="dataForm.type" :options="options" :show-all-levels="false" :props="props"
            placeholder="请选择" size="small" style="width:100%" collapse-tags clearable></el-cascader>
        </el-form-item>
        <el-form-item label="印章图片" prop="address">
          <el-upload class="avatar-uploader" :action="action" :headers="uploadHeader"
            accept='image/jpg,image/jpeg,image/png' :show-file-list="false" :on-success="handleSuccess"
            :on-change="beforeUpload" ref="upload" :on-error="onError">
            <img v-if="dataForm.address" :src="javaApi + '/img/' + dataForm.address" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="upFileVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="confirmConnect" :loading="loading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import limsTable from "@/components/Table/lims-table.vue";
import {
  addParameter,
  addSeal,
  delParameter,
  selectItemParameter,
  selectSeal,
  upParameter
} from "@/api/structural/laboratoryScope";
import { getCertificationDetail } from "@/api/structural/laboratory";
export default {
  components: {
    limsTable

  },
  computed: {
    action() {
      return this.javaApi + '/deviceScope/uploadFile'
    }
  },
  data() {
    return {
      queryParams: {
        laboratoryName: '',
        laboratoryNumber: '',
      },
      tableData: [],
      tableLoading: false,
      column: [
        { label: '实验室名称', prop: 'laboratoryName' },
        { label: '场所编码', prop: 'laboratoryNumber' },
        { label: '实验室代号', prop: 'laboratoryCode' },
        { label: '负责人', prop: 'head' },
        { label: '负责人电话', prop: 'phoneNumber' },
        { label: '地址', prop: 'address' },
        { label: '创建人', prop: 'createUserName' },
        { label: '创建时间', prop: 'createTime' },
        {
          dataType: 'action',
          fixed: 'right',
          label: '操作',
          width: '180px',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openAdd('edit', row);
              },
            },
            {
              name: '删除',
              type: 'text',
              clickFun: (row) => {
                this.delete(row);
              },
            },
            {
              name: '印章管理',
              type: 'text',
              clickFun: (row) => {
                this.fileManagement(row);
              },
            },
          ]
        }
      ],
      page: {
        total: 0,
        size: 10,
        current: 1
      },
      addDia: false,
      formTitle: '',
      laboratoryForm: {

      },
      operationType: '',
      userRules: {
        laboratoryName: [{ required: true, message: '请输入实验室名称', trigger: 'blur' }],
        laboratoryNumber: [{ required: true, message: '请输入场所编码', trigger: 'blur' }],
        head: [{ required: true, message: '请输入负责人', trigger: 'blur' }],
        phoneNumber: [{ required: true, message: '请输入负责人电话', trigger: 'blur' }],
      },
      currentRow: {},
      fileComponentTableLoading: false,
      fileComponentData: [],
      fileComponentDataColumn: [
        { label: '实验室名称', prop: 'laboratoryName' },
        { label: '印章图片', prop: 'address', dataType: 'image' },
        { label: '印章类型', prop: 'type' },
      ],
      fileComponentPage: {
        total: 0,
        size: 10,
        current: 1,
        layout: 'total, prev, pager, next'
      },
      fileVisible: false,
      upFileVisible: false,
      loading: false,
      dataForm: {
        type: '',
        address: '',
      },
      dataFormRules: {
        type: [{ required: true, message: '请选择印章类型', trigger: 'change' }],
        address: [{ required: false, message: '请上传图片', trigger: 'change' }],
      },
      props: { multiple: false, emitPath: false, },
      options: [
        {
          value: '实验室资质',
          label: '实验室资质',
          children: []
        },
        {
          value: '委托报告',
          label: '委托报告',
          children: null
        },
        {
          value: '进厂报告',
          label: '进厂报告',
          children: null
        },
      ],
    }
  },
  mounted() {
    this.refreshTable()
  },
  methods: {
    refreshTable() {
      this.tableLoading = true
      selectItemParameter({ ...this.page, ...this.queryParams }).then(res => {
        this.tableLoading = false
        if (res.code === 200) {
          this.tableData = res.data.records
          this.page.total = res.data.total
        }
      }).catch(err => {
        this.tableLoading = false
      })
    },
    // é‡ç½®
    refresh() {
      this.resetForm('queryForm')
      this.refreshTable()
    },
    // åˆ†é¡µåˆ‡æ¢
    pagination(page) {
      this.page.size = page.limit
      this.refreshTable()
    },
    openAdd(type, row) {
      this.formTitle = type === 'add' ? '新增实验室' : '编辑实验室'
      this.operationType = type
      if (type === 'edit') {
        this.laboratoryForm = this.HaveJson(row)
      }
      this.addDia = true
    },
    // æäº¤æ–°å¢žã€ç¼–辑实验室表单
    customAdd() {
      this.$refs['laboratoryForm'].validate((valid) => {
        if (valid) {
          this.loading = true
          if (this.operationType === 'add') {
            addParameter(this.laboratoryForm).then(res => {
              this.loading = false
              if (res.code !== 200) return
              this.$message.success('新增成功')
              this.refreshTable()
              this.reset()
            }).catch(err => {
              this.loading = false
            })
          } else {
            upParameter(this.laboratoryForm).then(res => {
              this.loading = false
              if (res.code !== 200) return
              this.$message.success('修改成功')
              this.refreshTable()
              this.reset()
            }).catch(err => {
              this.loading = false
            })
          }
        }
      })
    },
    reset() {
      this.resetForm('laboratoryForm')
      this.addDia = false
    },
    // åˆ é™¤å®žéªŒå®¤
    delete(row) {
      this.$confirm('是否删除当前数据?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        delParameter({ id: row.id }).then(res => {
          this.$message.success('删除成功')
          this.refreshTable()
        }).catch(e => {
          this.$message.error('删除失败')
        })
      }).catch(() => { })
    },
    // æ‰“开印章管理弹框
    fileManagement(row) {
      this.fileVisible = true;
      this.fileComponentTableLoading = true
      this.currentRow = row
      this.getFileComponentList()
    },
    getFileComponentList() {
      selectSeal({ id: this.currentRow.id, ...this.fileComponentPage }).then(res => {
        this.fileComponentTableLoading = false
        if (res.code === 200) {
          this.fileComponentData = res.data.records
          this.fileComponentPage.total = res.data.total
        }
      }).catch(err => {
        this.fileComponentTableLoading = false
      })
    },
    fileComponentPagination(page) {
      this.fileComponentPage.size = page.limit
      this.getFileComponentList()
    },
    // æ‰“开更新印章弹框
    openUpload() {
      this.dataForm.type = '';
      this.dataForm.address = '';
      this.upFileVisible = true;
      this.getCertificationOperation()
    },
    // æŸ¥è¯¢å°ç« ç±»åž‹
    getCertificationOperation() {
      const params = {
        current: -1,
        size: -1,
      }
      getCertificationDetail(params).then(res => {
        this.options[0].children = res.data.records.map(m => {
          m.value = m.name;
          m.label = m.name;
          return m
        });
      })
    },
    // æäº¤æ›´æ–°å°ç« 
    confirmConnect() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.loading = true;
          addSeal({ labId: this.currentRow.id, ...this.dataForm }).then(res => {
            this.loading = false;
            this.getFileComponentList()
            this.upFileVisible = false;
          })
        }
      })
    },
    handleSuccess(response,) {
      if (response.code === 200) {
        this.dataForm.address = response.data.url
      }
    },
    beforeUpload(file, type) {
      if (file.size > 1024 * 1024 * 10) {
        this.$message.error('上传文件不超过10M');
        this.$refs.upload.clearFiles()
        return false;
      } else {
        return true;
      }
    },
    onError(err, file, fileList, type) {
      this.$message.error('上传失败')
      this.$refs.upload.clearFiles()
    },
  }
}
</script>
<style scoped>
.capacity-scope {
  padding: 20px;
}

.search {
  height: 46px;
  display: flex;
  justify-content: space-between;
}

.btns {
  text-align: right;
  margin-bottom: 10px;
}

::v-deep .el-dialog__body {
  padding-top: 8px !important;
}

.avatar-uploader ::v-deep .el-upload {
  border: 1px dashed #666666;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader ::v-deep .el-upload:hover {
  border-color: #409EFF;
}

.avatar-uploader-icon {
  font-size: 20px;
  color: #8c939d;
  width: 90px;
  height: 90px;
  line-height: 90px;
  text-align: center;
}

.avatar {
  width: 90px;
  height: 90px;
  display: block;
}
</style>