修改设备模块bug

spring

2025-02-15 237f95b05e0f122ee9ec7beaf82ba366a8b220ed

 src/components/do/a6-device/management.vue

@@ -1,379 +1,752 @@
<!-- 设备工具明细 -->
<template>
   <div class="role_manage">
      <div class="search" v-show="!showData">
  <div class="role_manage">
    <div class="search" v-show="!showData">
      <div class="search_thing">
        <div class="search_label">状态：</div>
        <el-select v-model="componentData.entity.deviceStatus" placeholder="全部" size="small">
          <el-option v-for="item in deviceStatusList" :key="item.value" :label="item.label"
                     :value="item.value">
        <el-select
          v-model="componentData.entity.deviceStatus"
          placeholder="全部"
          size="small"
        >
          <el-option
            v-for="item in deviceStatusList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>
      <div class="search_thing">
        <div class="search_label">设备名称：</div>
        <div class="search_input">
          <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.deviceName"
                    @keyup.enter.native="refreshTable()">
          <el-input
            size="small"
            placeholder="请输入"
            clearable
            v-model="componentData.entity.deviceName"
            @keyup.enter.native="refreshTable()"
          >
          </el-input>
        </div>
      </div>
      <div class="search_thing">
        <div class="search_label">规格型号：</div>
        <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                            v-model="componentData.entity.specificationModel"
                                            @keyup.enter.native="refreshTable()"></el-input>
        <div class="search_input">
          <el-input
            size="small"
            placeholder="请输入"
            clearable
            v-model="componentData.entity.specificationModel"
            @keyup.enter.native="refreshTable()"
          ></el-input>
        </div>
      </div>
         <div class="search_thing" style="padding-left: 30px;">
            <el-button size="small" @click="refresh()">重 置</el-button>
            <el-button size="small" type="primary" @click="refreshTable()">查 询</el-button>
        <el-button size="small" type="primary" @click="dialogVisible2 = true">新 增</el-button>
        <el-button size="small" type="primary" @click="handleDownOne">导 出</el-button>
         </div>
      </div>
      <div class="table" v-show="!showData">
         <!-- 语法 子组件通过 this.$emit +传入方法名 调用父组件方法 例如  this.$emit（selectAllByOne） 就需在父组件声明并传入  @selectAllByOne="selectAllByOne" -->
         <ValueTable @selectAllByOne="selectAllByOne" @isUpdate="isUpdate" ref="ValueTable"
            :dateFormat="dateFormat"
            :upUrl="$api.deviceScope.upDeviceParameter" :delUrl="$api.deviceScope.delDeviceParameter"
            :componentData="componentData" :key="upIndex" :url="$api.deviceScope.selectDeviceParameter + '?laboratoryNameIsNull=' + laboratoryNameIsNull" />
      </div>
      <el-dialog :title="isUp ? '设备详情' : '档案修订'" :visible.sync="dialogVisible" width="70%"
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 置</el-button>
        <el-button size="small" type="primary" @click="refreshTable()"
          >查 询</el-button
        >
        <el-button size="small" type="primary" @click="dialogVisible2 = true"
          >新 增</el-button
        >
        <el-button size="small" type="primary" @click="handleDownOne"
          >导 出</el-button
        >
      </div>
    </div>
    <div class="table" v-show="!showData">
      <!-- 语法 子组件通过 this.$emit +传入方法名 调用父组件方法 例如  this.$emit（selectAllByOne） 就需在父组件声明并传入  @selectAllByOne="selectAllByOne" -->
      <ValueTable
        @selectAllByOne="selectAllByOne"
        @isUpdate="isUpdate"
        ref="ValueTable"
        :dateFormat="dateFormat"
        :upUrl="$api.deviceScope.upDeviceParameter"
        :delUrl="$api.deviceScope.delDeviceParameter"
        :componentData="componentData"
        :key="upIndex"
        :url="
          $api.deviceScope.selectDeviceParameter +
            '?laboratoryNameIsNull=' +
            laboratoryNameIsNull
        "
      />
    </div>
    <el-dialog
      :title="isUp ? '设备详情' : '档案修订'"
      :visible.sync="dialogVisible"
      width="70%"
      top="5vh"
         :before-close="handleClose">
         <el-row style="display:flex;justify-content: space-around;max-height: 75vh;overflow-y: auto;">
            <!-- 左边布局 -->
            <el-col :span="7">
               <el-col>
                  <!-- 图片 -->
                  <el-image class="img" style="width:100%;height: 320px;marginBottom:16px"
                     :src="javaApi + '/img/' + formData.imageUpload">
                     <div slot="error" class="image-error" style="width: calc(100% -2px);
      :before-close="handleClose"
    >
      <el-row
        style="display:flex;justify-content: space-around;max-height: 75vh;overflow-y: auto;"
      >
        <!-- 左边布局 -->
        <el-col :span="7">
          <el-col>
            <!-- 图片 -->
            <el-image
              class="img"
              style="width:100%;height: 320px;marginBottom:16px"
              :src="javaApi + '/img/' + formData.imageUpload"
            >
              <div
                slot="error"
                class="image-error"
                style="width: calc(100% -2px);
            height: 318px;
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #EEEEEE;">
                        <i class="el-icon-picture-outline" style="font-size:60px;color:#666666;"></i>
                     </div>
                  </el-image>
                  <!-- 表单 -->
                  <el-form :label-position="labelPosition" :model="formData" label-width="120px">
                     <el-form-item label="仪器名称:" required>
                        <el-input :disabled="isUp" v-model="formData.deviceName" size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="仪器名称EN:" required>
                        <el-input :disabled="isUp" v-model="formData.enDeviceName" size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="规格型号:" required>
                        <el-input :disabled="isUp" v-model="formData.specificationModel"
                           size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="生产厂家:">
                        <el-input :disabled="isUp" v-model="formData.manufacturer" size="small"></el-input>
                     </el-form-item>
                  </el-form>
               </el-col>
            </el-col>
            <!-- 中间布局 -->
            <el-col :span="7">
               <el-form :label-position="labelPosition" :model="formData" label-width="116px">
                  <el-form-item label="校准服务机构:">
                     <el-input :disabled="isUp" v-model="formData.calibrationServices" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="出厂编号:">
                     <el-input :disabled="isUp" v-model="formData.factoryNo" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="管理编号:" required>
                     <el-input :disabled="isUp" v-model="formData.managementNumber" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="购置日期:">
                     <el-date-picker :disabled="isUp" style="width:100%" v-model="formData.acquisitionDate"
                        type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss" size="small"
                        placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="校准日期:" required>
                     <el-date-picker :disabled="isUp" style="width:100%" v-model="formData.activationDate"
                        type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss" size="small"
                        placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="管理人:">
                     <el-select v-model="formData.equipmentManager" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option :disabled="isUp" v-for="item in responsiblePersonList" :key="item.value"
                           :label="item.label" :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="存放点:">
                     <el-input :disabled="isUp" v-model="formData.storagePoint" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="技术指标:">
                     <el-input :disabled="isUp" v-model="formData.technicalIndicators" :rows="7" type="textarea"
                        size="small"></el-input>
                  </el-form-item>
               </el-form>
            </el-col>
            <!-- 右边布局 -->
            <el-col :span="7">
               <el-form :label-position="labelPosition" :model="formData" label-width="140px" ref="ruleForm">
                  <!-- 实验室列表 -->
                  <el-form-item label="所属部门:">
                     <el-select :disabled="isUp" v-model="formData.subordinateDepartmentsId" placeholder="请选择"
                        size="small" style="width:100%">
                        <el-option v-for="item in subordinateDepartmentsList" :key="item.value"
                           :label="item.label" :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="检测项目:">
                     <el-cascader :disabled="isUp" v-model="formData.insProductIds" :options="options"
                        :show-all-levels="false" :props="props" placeholder="请选择" size="small"
                        style="width:100%;" :collapse-tags="!isUp" separator="," filterable
                        clearable></el-cascader>
                  </el-form-item>
                  <el-form-item label="最近校准日期:" v-if="isUp">
                     <el-date-picker :disabled="isUp" style="width:100%" v-model="formData.latestTraceability"
                        format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" size="small"
                        placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="下次校准日期:" v-if="isUp">
                     <el-date-picker :disabled="isUp" style="width:100%" v-model="formData.latestTraceability"
                        format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" size="small"
                        placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="设备类型:">
                     <el-select :disabled="isUp" v-model="formData.largeCategory" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in equipmentList" :key="item.value" :label="item.label"
                           :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="单价(万元):">
                     <el-input :disabled="isUp" v-model="formData.unitPrice" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="当前状态:" required>
                     <el-select :disabled="isUp" v-model="formData.deviceStatus" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in deviceStatusList" :key="item.value" :label="item.label"
                           :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="校准周期（月）:" required>
                     <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="图片:">
                     <div
                        style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;lineHeight:32px;display:flex;justify-content: space-around;font-size: 13px;">
                        <div v-show="formData.imageName" class="picName">{{ formData.imageName }}</div>
                        <el-upload :disabled="isUp" :action="action" :on-success="handleSuccessUpImg2"
                           :show-file-list="false" accept='image/jpg,image/jpeg,image/png' :headers="headers"
                           :on-change="beforeUpload" :on-error="onError" ref='upload'>
                           <el-button type="text" style="height:30px;padding-top:8px">上传</el-button>
                        </el-upload>
                     </div>
                  </el-form-item>
               </el-form>
            </el-col>
         </el-row>
         <span slot="footer" class="dialog-footer">
            <el-row v-if="!isUp">
               <el-button @click="handleClose">取 消</el-button>
               <el-button type="primary" @click="submitForm" :loading="upLoad">确 定</el-button>
            </el-row>
         </span>
      </el-dialog>
      <!-- 新增-->
      <el-dialog title="新增设备" top="5vh" :visible.sync="dialogVisible2" width="70%" :before-close="handleClose2">
         <el-row style="display:flex;justify-content: space-around;">
            <!-- 左边布局 -->
            <el-col :span="7">
               <el-col>
                  <!-- 图片 -->
                  <el-image class="img" style="width:100%;height: 320px;margin-bottom:16px"
                     :src="javaApi + '/img/' + formData2.imageUpload">
                     <div slot="error" class="image-error" style="width: calc(100% -2px);
            border: 1px solid #EEEEEE;"
              >
                <i
                  class="el-icon-picture-outline"
                  style="font-size:60px;color:#666666;"
                ></i>
              </div>
            </el-image>
            <!-- 表单 -->
            <el-form
              :label-position="labelPosition"
              :model="formData"
              label-width="120px"
            >
              <el-form-item label="仪器名称:" required>
                <el-input
                  :disabled="isUp"
                  v-model="formData.deviceName"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="仪器名称EN:" required>
                <el-input
                  :disabled="isUp"
                  v-model="formData.enDeviceName"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="规格型号:" required>
                <el-input
                  :disabled="isUp"
                  v-model="formData.specificationModel"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="生产厂家:">
                <el-input
                  :disabled="isUp"
                  v-model="formData.manufacturer"
                  size="small"
                ></el-input>
              </el-form-item>
            </el-form>
          </el-col>
        </el-col>
        <!-- 中间布局 -->
        <el-col :span="7">
          <el-form
            :label-position="labelPosition"
            :model="formData"
            label-width="116px"
          >
            <el-form-item label="校准服务机构:">
              <el-input
                :disabled="isUp"
                v-model="formData.calibrationServices"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="出厂编号:">
              <el-input
                :disabled="isUp"
                v-model="formData.factoryNo"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="管理编号:" required>
              <el-input
                :disabled="isUp"
                v-model="formData.managementNumber"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="购置日期:">
              <el-date-picker
                :disabled="isUp"
                style="width:100%"
                v-model="formData.acquisitionDate"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd HH:mm:ss"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="校准日期:" required>
              <el-date-picker
                :disabled="isUp"
                style="width:100%"
                v-model="formData.activationDate"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd HH:mm:ss"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="管理人:">
              <el-select
                v-model="formData.equipmentManager"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  :disabled="isUp"
                  v-for="item in responsiblePersonList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="存放点:">
              <el-input
                :disabled="isUp"
                v-model="formData.storagePoint"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="技术指标:">
              <el-input
                :disabled="isUp"
                v-model="formData.technicalIndicators"
                :rows="7"
                type="textarea"
                size="small"
              ></el-input>
            </el-form-item>
          </el-form>
        </el-col>
        <!-- 右边布局 -->
        <el-col :span="7">
          <el-form
            :label-position="labelPosition"
            :model="formData"
            label-width="140px"
            ref="ruleForm"
          >
            <!-- 实验室列表 -->
            <el-form-item label="所属部门:">
              <el-select
                :disabled="isUp"
                v-model="formData.subordinateDepartmentsId"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in subordinateDepartmentsList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="检测项目:">
              <el-cascader
                :disabled="isUp"
                v-model="formData.insProductIds"
                :options="options"
                :show-all-levels="false"
                :props="props"
                placeholder="请选择"
                size="small"
                style="width:100%;"
                :collapse-tags="!isUp"
                separator=","
                filterable
                clearable
              ></el-cascader>
            </el-form-item>
            <el-form-item label="最近校准日期:" v-if="isUp">
              <el-date-picker
                :disabled="isUp"
                style="width:100%"
                v-model="formData.latestTraceability"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                type="date"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="下次校准日期:" v-if="isUp">
              <el-date-picker
                :disabled="isUp"
                style="width:100%"
                v-model="formData.latestTraceability"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                type="date"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="设备类型:">
              <el-select
                :disabled="isUp"
                v-model="formData.largeCategory"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in equipmentList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="单价(万元):">
              <el-input
                :disabled="isUp"
                v-model="formData.unitPrice"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="当前状态:" required>
              <el-select
                :disabled="isUp"
                v-model="formData.deviceStatus"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in deviceStatusList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="校准周期（月）:" required>
              <el-input
                :disabled="isUp"
                v-model="formData.calibrationDate"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="图片:">
              <div
                style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;lineHeight:32px;display:flex;justify-content: space-around;font-size: 13px;"
              >
                <div v-show="formData.imageName" class="picName">
                  {{ formData.imageName }}
                </div>
                <el-upload
                  :disabled="isUp"
                  :action="action"
                  :on-success="handleSuccessUpImg2"
                  :show-file-list="false"
                  accept="image/jpg,image/jpeg,image/png"
                  :headers="headers"
                  :on-change="beforeUpload"
                  :on-error="onError"
                  ref="upload"
                >
                  <el-button type="text" style="height:30px;padding-top:8px"
                    >上传</el-button
                  >
                </el-upload>
              </div>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-row v-if="!isUp">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" @click="submitForm" :loading="upLoad"
            >确 定</el-button
          >
        </el-row>
      </span>
    </el-dialog>
    <!-- 新增-->
    <el-dialog
      title="新增设备"
      top="5vh"
      :visible.sync="dialogVisible2"
      width="70%"
      :before-close="handleClose2"
    >
      <el-row style="display:flex;justify-content: space-around;">
        <!-- 左边布局 -->
        <el-col :span="7">
          <el-col>
            <!-- 图片 -->
            <el-image
              class="img"
              style="width:100%;height: 320px;margin-bottom:16px"
              :src="javaApi + '/img/' + formData2.imageUpload"
            >
              <div
                slot="error"
                class="image-error"
                style="width: calc(100% -2px);
          height: 318px;
          border-radius: 16px;
          display: flex;
          align-items: center;
          justify-content: center;
          border: 1px solid #EEEEEE;">
                        <i class="el-icon-picture-outline" style="font-size:60px;color:#666666;"></i>
                     </div>
                  </el-image>
                  <!-- 表单 -->
                  <el-form :label-position="labelPosition" :model="formData2" label-width="120px">
                     <el-form-item label="仪器名称:" required>
                        <el-input v-model="formData2.deviceName" size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="仪器名称EN:" required>
                        <el-input v-model="formData2.enDeviceName" size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="规格型号:" required>
                        <el-input v-model="formData2.specificationModel" size="small"></el-input>
                     </el-form-item>
                     <el-form-item label="生产厂家:">
                        <el-input v-model="formData2.manufacturer" size="small"></el-input>
                     </el-form-item>
                  </el-form>
               </el-col>
            </el-col>
            <!-- 中间布局 -->
            <el-col :span="7">
               <el-form :label-position="labelPosition" :model="formData2" label-width="110px">
                  <!-- <el-form-item label="生产厂家EN:">
          border: 1px solid #EEEEEE;"
              >
                <i
                  class="el-icon-picture-outline"
                  style="font-size:60px;color:#666666;"
                ></i>
              </div>
            </el-image>
            <!-- 表单 -->
            <el-form
              :label-position="labelPosition"
              :model="formData2"
              label-width="120px"
            >
              <el-form-item label="仪器名称:" required>
                <el-input
                  v-model="formData2.deviceName"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="仪器名称EN:" required>
                <el-input
                  v-model="formData2.enDeviceName"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="规格型号:" required>
                <el-input
                  v-model="formData2.specificationModel"
                  size="small"
                ></el-input>
              </el-form-item>
              <el-form-item label="生产厂家:">
                <el-input
                  v-model="formData2.manufacturer"
                  size="small"
                ></el-input>
              </el-form-item>
            </el-form>
          </el-col>
        </el-col>
        <!-- 中间布局 -->
        <el-col :span="7">
          <el-form
            :label-position="labelPosition"
            :model="formData2"
            label-width="110px"
          >
            <!-- <el-form-item label="生产厂家EN:">
              <el-input v-model="formData2.factoryNo" size="small"></el-input>
            </el-form-item> -->
                  <el-form-item label="校准服务机构:">
                     <el-input v-model="formData2.calibrationServices" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="出厂编号:">
                     <el-input v-model="formData2.factoryNo" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="管理编号:" required>
                     <el-input v-model="formData2.managementNumber" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="购置日期:">
                     <el-date-picker style="width:100%" v-model="formData2.acquisitionDate" type="date"
                        format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss" size="small" placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="启用日期:" required>
                     <el-date-picker style="width:100%" v-model="formData2.activationDate" type="date"
                        format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss" size="small" placeholder="选择日期">
                     </el-date-picker>
                  </el-form-item>
                  <el-form-item label="管理人:">
                     <el-select v-model="formData2.equipmentManager" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in responsiblePersonList" :key="item.value" :label="item.label"
                           :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="存放点:">
                     <el-input v-model="formData2.storagePoint" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="技术指标:">
                     <el-input v-model="formData2.technicalIndicators" :rows="7" type="textarea"
                        size="small"></el-input>
                  </el-form-item>
               </el-form>
            </el-col>
            <!-- 右边布局 -->
            <el-col :span="7">
               <el-form :label-position="labelPosition" :model="formData2" label-width="120px" ref="ruleForm">
                  <!-- 实验室列表 -->
                  <el-form-item label="所属部门:">
                     <el-select v-model="formData2.subordinateDepartmentsId" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in subordinateDepartmentsList" :key="item.value"
                           :label="item.label" :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="检测项目:">
                     <el-cascader v-model="formData2.insProductIds" :options="options" :show-all-levels="false"
                        :props="props" placeholder="请选择" size="small" style="width:100%" collapse-tags
                        separator="," filterable clearable></el-cascader>
                  </el-form-item>
                  <el-form-item label="设备类型:">
                     <el-select v-model="formData2.largeCategory" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in equipmentList" :key="item.value" :label="item.label"
                           :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="单价(万元):">
                     <el-input v-model="formData2.unitPrice" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="当前状态:" required>
                     <el-select v-model="formData2.deviceStatus" placeholder="请选择" size="small"
                        style="width:100%">
                        <el-option v-for="item in deviceStatusList" :key="item.id" :label="item.label"
                           :value="item.value">
                        </el-option>
                     </el-select>
                  </el-form-item>
                  <el-form-item label="校准周期（月）:" required>
                     <el-input v-model="formData2.calibrationDate" size="small"></el-input>
                  </el-form-item>
                  <el-form-item label="图片:">
                     <div
                        style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;line-height:32px;display:flex;justify-content: space-around;font-size: 13px;">
                        <div v-show="formData2.imageName" class="picName">{{ formData2.imageName }}</div>
                        <el-upload :action="action" :on-success="handleSuccessUpImg2" :show-file-list="false"
                           accept='image/jpg,image/jpeg,image/png' :headers="headers" :on-change="beforeUpload"
                           :on-error="onError" ref='upload'>
                           <el-button type="text" style="height:30px;padding-top:8px">上传</el-button>
                        </el-upload>
                     </div>
                  </el-form-item>
               </el-form>
            </el-col>
         </el-row>
         <span slot="footer" class="dialog-footer">
            <el-row>
               <el-button @click="handleClose2">取 消</el-button>
               <el-button type="primary" @click="submitForm2" :loading="upLoad2">确 定</el-button>
            </el-row>
         </span>
      </el-dialog>
      <el-dialog title="数采配置" :visible.sync="dialogVisible3" width="400px">
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>IP：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.ip"></el-input>
         </div>
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>采集地址：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.collectUrl"></el-input>
         </div>
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>储存地址：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.storageUrl"></el-input>
         </div>
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>参照：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.refer"></el-input>
         </div>
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>X：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.x"></el-input>
         </div>
         <div class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label"><span style="color:red;margin-right: 4px;">*</span>Y：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.y"></el-input>
         </div>
         <div class="search_thing">
            <div class="search_label">公式：</div>
            <el-input size="small" placeholder="请输入" clearable v-model="configForm.formula"></el-input>
         </div>
         <span slot="footer" class="dialog-footer">
            <el-row>
               <el-button @click="dialogVisible3 = false">取 消</el-button>
               <el-button type="primary" @click="submitForm3" :loading="upLoad3">确 定</el-button>
            </el-row>
         </span>
      </el-dialog>
      <dataAcquisitionConfig v-if="showData" :deviceId="deviceId" />
   </div>
            <el-form-item label="校准服务机构:">
              <el-input
                v-model="formData2.calibrationServices"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="出厂编号:">
              <el-input v-model="formData2.factoryNo" size="small"></el-input>
            </el-form-item>
            <el-form-item label="管理编号:" required>
              <el-input
                v-model="formData2.managementNumber"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="购置日期:">
              <el-date-picker
                style="width:100%"
                v-model="formData2.acquisitionDate"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd HH:mm:ss"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="启用日期:" required>
              <el-date-picker
                style="width:100%"
                v-model="formData2.activationDate"
                type="date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd HH:mm:ss"
                size="small"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="管理人:">
              <el-select
                v-model="formData2.equipmentManager"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in responsiblePersonList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="存放点:">
              <el-input
                v-model="formData2.storagePoint"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="技术指标:">
              <el-input
                v-model="formData2.technicalIndicators"
                :rows="7"
                type="textarea"
                size="small"
              ></el-input>
            </el-form-item>
          </el-form>
        </el-col>
        <!-- 右边布局 -->
        <el-col :span="7">
          <el-form
            :label-position="labelPosition"
            :model="formData2"
            label-width="120px"
            ref="ruleForm"
          >
            <!-- 实验室列表 -->
            <el-form-item label="所属部门:">
              <el-select
                v-model="formData2.subordinateDepartmentsId"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in subordinateDepartmentsList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="检测项目:">
              <el-cascader
                v-model="formData2.insProductIds"
                :options="options"
                :show-all-levels="false"
                :props="props"
                placeholder="请选择"
                size="small"
                style="width:100%"
                collapse-tags
                separator=","
                filterable
                clearable
              ></el-cascader>
            </el-form-item>
            <el-form-item label="设备类型:">
              <el-select
                v-model="formData2.largeCategory"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in equipmentList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="单价(万元):">
              <el-input v-model="formData2.unitPrice" size="small"></el-input>
            </el-form-item>
            <el-form-item label="当前状态:" required>
              <el-select
                v-model="formData2.deviceStatus"
                placeholder="请选择"
                size="small"
                style="width:100%"
              >
                <el-option
                  v-for="item in deviceStatusList"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="校准周期（月）:" required>
              <el-input
                v-model="formData2.calibrationDate"
                size="small"
              ></el-input>
            </el-form-item>
            <el-form-item label="图片:">
              <div
                style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;line-height:32px;display:flex;justify-content: space-around;font-size: 13px;"
              >
                <div v-show="formData2.imageName" class="picName">
                  {{ formData2.imageName }}
                </div>
                <el-upload
                  :action="action"
                  :on-success="handleSuccessUpImg2"
                  :show-file-list="false"
                  accept="image/jpg,image/jpeg,image/png"
                  :headers="headers"
                  :on-change="beforeUpload"
                  :on-error="onError"
                  ref="upload"
                >
                  <el-button type="text" style="height:30px;padding-top:8px"
                    >上传</el-button
                  >
                </el-upload>
              </div>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-row>
          <el-button @click="handleClose2">取 消</el-button>
          <el-button type="primary" @click="submitForm2" :loading="upLoad2"
            >确 定</el-button
          >
        </el-row>
      </span>
    </el-dialog>
    <el-dialog title="数采配置" :visible.sync="dialogVisible3" width="400px">
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>IP：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.ip"
        ></el-input>
      </div>
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>采集地址：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.collectUrl"
        ></el-input>
      </div>
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>储存地址：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.storageUrl"
        ></el-input>
      </div>
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>参照：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.refer"
        ></el-input>
      </div>
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>X：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.x"
        ></el-input>
      </div>
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>Y：
        </div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.y"
        ></el-input>
      </div>
      <div class="search_thing">
        <div class="search_label">公式：</div>
        <el-input
          size="small"
          placeholder="请输入"
          clearable
          v-model="configForm.formula"
        ></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-row>
          <el-button @click="dialogVisible3 = false">取 消</el-button>
          <el-button type="primary" @click="submitForm3" :loading="upLoad3"
            >确 定</el-button
          >
        </el-row>
      </span>
    </el-dialog>
    <dataAcquisitionConfig v-if="showData" :deviceId="deviceId" />
  </div>
</template>

<script>
import ValueTable from '../../tool/value-table.vue'
import dataAcquisitionConfig from './acquisition-config.vue'
import ValueTable from "../../tool/value-table.vue";
import dataAcquisitionConfig from "./acquisition-config.vue";
export default {
   props: {
  props: {
    clickNodeVal: {
      type: Object,
      default: () => {
@@ -381,661 +754,707 @@
      }
    }
  },
   components: {
      ValueTable,
      dataAcquisitionConfig,
   },
   data() {
      return {
         dateFormat: 'yyyy-MM-dd',
         deviceId: '',
         fileTypeOptions: [
            { label: 'csv', value: '.csv' },
            { label: 'db', value: '.db' },
            { label: 'mdb', value: '.mdb' },
            { label: 'word', value: '.docx' },
            { label: 'excel', value: '.xlsx' },
            { label: 'txt', value: '.txt' },
            { label: 'png', value: '.png' },
         ],
         //是否是档案修订  true不是 false是
         isUp: true,
         formData: {
         },
         formData2: {
            imageUpload: '',
            imageName: ''
         },
         value: '',
         props: { multiple: true, emitPath: false, value: 'id', label: 'name' },
         options: [],
         labelPosition: 'right',
         dialogVisible: false,
         dialogVisible2: false,
         addPower: false,
         showData: false, // 数采配置页面
         tableList: [],
         componentData: {
            entity: {
               largeCategory: null,
               orderBy: {
                  field: 'id',
                  order: 'asc'
               }
            },
            init: false,
            isIndex: true,
            showSelect: false,
            select: false,
            do: [{
               id: 'delete',
               font: '删除',
               type: 'text',
               method: 'doDiy'
            }, {
               id: 'archives',
               font: '档案修订',
               type: 'text',
               method: 'isUpdate'
            }, {
               id: 'handleConfig',
               font: '数采配置',
               type: 'text',
               method: 'handleConfig',
               disabFun: (row, index) => {
            return row.insProductItem == null || row.insProductItem === ''
               }
            }],
            headNoShow: ['enDeviceName'],
            tagField: {
               deviceStatus: {
                  select: []
               },
               equipmentManager: {
                  select: []
               },
               authorizedPerson: {
                  select: []
               },
               insProductIds: {
                  select: []
               }
            },
            linkEvent: {
               deviceName: {
                  method: 'selectAllByOne'
               }
            },
            selectField: {
               authorizedPerson: {
                  select: [],
                  choose: true
               },
               equipmentManager: {
                  select: []
               },
               insProductIds: {
                  select: [],
                  choose: true
               },
               largeCategory: {
                  select: []
               },
            },
            requiredAdd: [],
            requiredUp: [],
            needSort: ['deviceName', 'acquisitionDate', 'activationDate', 'lastCalibrationDate', 'nextCalibrationDate', 'deviceStatus'],
         },
         entityCopy: {},
         upIndex: 0,
         addDia: true,
         addPower: true,
         //设备类型列表
         equipmentList: [],
         // 负责人列表
         responsiblePersonList: [],
         // 授权人列表
         authorizerList: [],
         // 当前状态列表
         deviceStatusList: [],
         // 所属部门
         subordinateDepartmentsList: [],
         upLoad: false,
         upLoad2: false,
         dialogVisible3: false,
         upLoad3: false,
         configForm: {},
         laboratoryNameIsNull: false
      }
   },
   computed: {
      headers() {
         return {
            'token': sessionStorage.getItem('token')
         }
      },
      action() {
         return this.javaApi + this.$api.deviceScope.uploadFile
      }
   },
   mounted() {
      this.entityCopy = this.HaveJson(this.componentData.entity)
      this.getPower()
      this.selectEnumByCategory()
      this.selectDevicePrincipal()
      this.obtainItemParameterList()
      this.getInsProductIds()
      // this.$customEvents.$on('largeCategory', this.handleNotification);
      // 初始化
      this.clickSidebar(this.clickNodeVal)
   },
   methods: {
      //分类
      handleNotification(cate) {
         this.componentData.entity.largeCategory = cate
      },
      obtainItemParameterList() {
         this.$axios.get(this.$api.laboratoryScope.obtainItemParameterList).then(res => {
            let data = []
            res.data.forEach(a => {
               data.push({
                  label: a.laboratoryName,
                  value: a.id
               })
            })
            this.subordinateDepartmentsList = data
         })
      },
      refreshTable(e) {
         this.$refs['ValueTable'].selectList(e)
      },
      refresh() {
         this.componentData.entity.deviceStatus = null
      this.componentData.entity.deviceName = null
      this.componentData.entity.specificationModel = null
      this.refreshTable()
         // this.upIndex++
      },
  components: {
    ValueTable,
    dataAcquisitionConfig
  },
  data() {
    return {
      dateFormat: "yyyy-MM-dd",
      deviceId: "",
      fileTypeOptions: [
        { label: "csv", value: ".csv" },
        { label: "db", value: ".db" },
        { label: "mdb", value: ".mdb" },
        { label: "word", value: ".docx" },
        { label: "excel", value: ".xlsx" },
        { label: "txt", value: ".txt" },
        { label: "png", value: ".png" }
      ],
      //是否是档案修订  true不是 false是
      isUp: true,
      formData: {},
      formData2: {
        imageUpload: "",
        imageName: ""
      },
      value: "",
      props: { multiple: true, emitPath: false, value: "id", label: "name" },
      options: [],
      labelPosition: "right",
      dialogVisible: false,
      dialogVisible2: false,
      addPower: false,
      showData: false, // 数采配置页面
      tableList: [],
      componentData: {
        entity: {
          largeCategory: null,
          deviceName: null,
          orderBy: {
            field: "id",
            order: "asc"
          }
        },
        init: false,
        isIndex: true,
        showSelect: false,
        select: false,
        do: [
          {
            id: "delete",
            font: "删除",
            type: "text",
            method: "doDiy"
          },
          {
            id: "archives",
            font: "档案修订",
            type: "text",
            method: "isUpdate"
          }
          // {
          //   id: "handleConfig",
          //   font: "数采配置",
          //   type: "text",
          //   method: "handleConfig",
          //   disabFun: (row, index) => {
          //     return row.insProductItem == null || row.insProductItem === "";
          //   }
          // }
        ],
        headNoShow: ["enDeviceName"],
        tagField: {
          deviceStatus: {
            select: []
          },
          equipmentManager: {
            select: []
          },
          authorizedPerson: {
            select: []
          },
          insProductIds: {
            select: []
          }
        },
        linkEvent: {
          deviceName: {
            method: "selectAllByOne"
          }
        },
        selectField: {
          authorizedPerson: {
            select: [],
            choose: true
          },
          equipmentManager: {
            select: []
          },
          insProductIds: {
            select: [],
            choose: true
          },
          largeCategory: {
            select: []
          }
        },
        requiredAdd: [],
        requiredUp: [],
        needSort: [
          "deviceName",
          "acquisitionDate",
          "activationDate",
          "lastCalibrationDate",
          "nextCalibrationDate",
          "deviceStatus"
        ]
      },
      entityCopy: {},
      upIndex: 0,
      addDia: true,
      addPower: true,
      //设备类型列表
      equipmentList: [],
      // 负责人列表
      responsiblePersonList: [],
      // 授权人列表
      authorizerList: [],
      // 当前状态列表
      deviceStatusList: [],
      // 所属部门
      subordinateDepartmentsList: [],
      upLoad: false,
      upLoad2: false,
      dialogVisible3: false,
      upLoad3: false,
      configForm: {},
      laboratoryNameIsNull: false
    };
  },
  computed: {
    headers() {
      return {
        token: sessionStorage.getItem("token")
      };
    },
    action() {
      return this.javaApi + this.$api.deviceScope.uploadFile;
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity);
    this.getPower();
    this.selectEnumByCategory();
    this.selectDevicePrincipal();
    this.obtainItemParameterList();
    this.getInsProductIds();
    // this.$customEvents.$on('largeCategory', this.handleNotification);
    // 初始化
    this.clickSidebar(this.clickNodeVal);
  },
  methods: {
    //分类
    handleNotification(cate) {
      this.componentData.entity.largeCategory = cate;
    },
    obtainItemParameterList() {
      this.$axios
        .get(this.$api.laboratoryScope.obtainItemParameterList)
        .then(res => {
          let data = [];
          res.data.forEach(a => {
            data.push({
              label: a.laboratoryName,
              value: a.id
            });
          });
          this.subordinateDepartmentsList = data;
        });
    },
    refreshTable(e) {
      this.$refs["ValueTable"].selectList(e);
    },
    refresh() {
      this.componentData.entity.deviceStatus = null;
      this.componentData.entity.deviceName = null;
      this.componentData.entity.specificationModel = null;
      this.refreshTable();
      // this.upIndex++
    },
    // 导出
    handleDownOne() {
      this.outLoading = true
      this.$axios.get(this.$api.deviceCheck.exportEquipmentDetails, {
        responseType: "blob"
      }).then(res => {
        this.outLoading = false
        const blob = new Blob([res], { type: 'application/octet-stream' });
        //将Blob 对象转换成字符串
        let reader = new FileReader();
        reader.readAsText(blob, 'utf-8');
        reader.onload = () => {
          try {
            let result = JSON.parse(reader.result);
            if (result.message) {
              this.$message.error(result.message);
            } else {
      this.outLoading = true;
      this.$axios
        .get(this.$api.deviceCheck.exportEquipmentDetails, {
          responseType: "blob"
        })
        .then(res => {
          this.outLoading = false;
          const blob = new Blob([res], { type: "application/octet-stream" });
          //将Blob 对象转换成字符串
          let reader = new FileReader();
          reader.readAsText(blob, "utf-8");
          reader.onload = () => {
            try {
              let result = JSON.parse(reader.result);
              if (result.message) {
                this.$message.error(result.message);
              } else {
                const url = URL.createObjectURL(blob);
                const link = document.createElement("a");
                link.href = url;
                link.download = "设备仪器一览表.doc";
                link.click();
                this.$message.success("导出成功");
              }
            } catch (err) {
              console.log(err);
              const url = URL.createObjectURL(blob);
              const link = document.createElement('a');
              const link = document.createElement("a");
              link.href = url;
              link.download = '设备仪器一览表.doc';
              link.download = "设备仪器一览表.doc";
              link.click();
              this.$message.success('导出成功')
              this.$message.success("导出成功");
            }
          } catch (err) {
            console.log(err);
            const url = URL.createObjectURL(blob);
            const link = document.createElement('a');
            link.href = url;
            link.download = '设备仪器一览表.doc';
            link.click();
            this.$message.success('导出成功')
          }
        }
      })
          };
        });
    },
      // 权限分配
      getPower(radio) {
         let power = JSON.parse(sessionStorage.getItem('power'))
         let up = false
         let del = false
         let add = false
         let config = false
         for (var i = 0; i < power.length; i++) {
            if (power[i].menuMethod == 'upDeviceParameter') {
               up = true
            }
            if (power[i].menuMethod == 'delDeviceParameter') {
               del = true
            }
            if (power[i].menuMethod == 'addDeviceParameter') {
               add = true
            }
            if (power[i].menuMethod == 'saveDataAcquisitionConfiguration') {
               config = true
            }
         }
         if (!config) {
            this.componentData.do.splice(2, 1)
         }
         if (!up) {
            this.componentData.do.splice(1, 1)
         }
         if (!del) {
            this.componentData.do.splice(0, 1)
         }
         this.addPower = add
      },
      // 获取字典
      selectEnumByCategory() {
         this.$axios.post(this.$api.enums.selectEnumByCategory, {
            category: "设备状态"
         }).then(res => {
            this.deviceStatusList = res.data
            this.deviceStatusList.forEach(a => {
               if (!isNaN(a.value)) {
                  a.value = parseInt(a.value)
               }
            })
            this.componentData.tagField.deviceStatus.select = res.data
         })
         this.$axios.post(this.$api.enums.selectEnumByCategory, {
            category: "设备分类"
         }).then(res => {
            this.equipmentList = res.data
         })
      },
      // 获取负责人列表
      selectDevicePrincipal() {
         this.$axios.get(this.$api.deviceScope.selectDevicePrincipal).then(res => {
            let data = []
            res.data.forEach(a => {
               data.push({
                  label: a.name,
                  value: a.id
               })
            })
            this.responsiblePersonList = data
            this.authorizerList = data
            this.componentData.tagField.equipmentManager = data
            this.componentData.tagField.authorizedPerson = data
         })
      },
      getInsProductIds() {
         this.$axios.post(this.$api.capacityScope.getInsProduction).then(res => {
            this.componentData.tagField.insProductIds.select = []
            this.componentData.selectField.insProductIds.select = []
            this.options = res.data.map((m, i) => {
               m.id = m.name;
               let children = m.children.map(n => {
                  n.label = n.name;
                  n.value = n.id;
                  return n
               })
               this.componentData.tagField.insProductIds.select = [...this.componentData.tagField.insProductIds.select, ...children]
               this.componentData.selectField.insProductIds.select = [...this.componentData.selectField.insProductIds.select, ...children]
               return m
            })
            this.options.forEach(item => {
               if (item.children.length == 0) {
                  item.children = null;
               } else {
                  item.children.forEach(m => {
                     if (m.children.length == 0) {
                        m.children = null;
                     } else {
                        m.children.forEach(n => {
                           if (n.children && n.children.length == 0) {
                              n.children = null;
                           }
                        })
                     }
                  })
               }
            })
         })
      },
      handleClose() {
         this.formData = {}
         this.formData2 = {
            imageUpload: '',
            imageName: ''
         }
         this.dialogVisible = false;
         this.upLoad = false;
      },
      handleClose2() {
         this.formData = {}
         this.formData2 = {
            imageUpload: '',
            imageName: ''
         }
         this.dialogVisible2 = false;
         this.upLoad = false;
      },
      selectAllByOne(row) {
         this.isUp = true
         //打开弹框
         this.dialogVisible = true;
         //row = 点击对应行值
         //复制给formData
         this.formData = this.HaveJson(row);
         console.log(row.insProductIds + 'valll');
         this.formData.insProductIds = row.insProductIds ? row.insProductIds.split(',') : [];
      },
      isUpdate(row) {
         //修改  isUp 为档案修改
         this.isUp = false
         //打开弹框
         this.dialogVisible = true;
         //row = 点击对应行值一行值
         //复制给formData
         this.formData = this.HaveJson(row);
         if (typeof (row.insProductIds) === 'number') {
            row.insProductIds = row.insProductIds + ''
         }
         this.formData.insProductIds = row.insProductIds ? row.insProductIds.split(',') : [];
         // 将时间格式为yyyy-MM-dd 进行转换
         const dateRegex = /^\d{4}-\d{2}-\d{2}$/
         Object.keys(this.formData).forEach(key => {
            if(dateRegex.test(this.formData[key])) {
               this.formData[key] = `${this.formData[key]} 00:00:00`
            }
         })
      },
      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()
      },
      // 上传图片成功
      handleSuccessUpImg(response,) {
         if (response.code == 200) {
            this.formData.imageUpload = response.data.url;
            this.formData.imageName = response.data.name;
         }
      },
      handleSuccessUpImg2(response) {
         if (response.code == 200) {
            this.$nextTick(() => {
               this.formData.imageUpload = response.data.url;
               this.formData.imageName = response.data.name;
               this.formData2.imageUpload = response.data.url;
               this.formData2.imageName = response.data.name;
            })
         }
      },
      submitForm() {
         if (!this.formData.deviceName) {
            this.$message.error('未输入仪器名称')
            return
         }
         if (!this.formData.enDeviceName) {
            this.$message.error('未输入仪器名称EN')
            return
         }
         if (!this.formData.specificationModel) {
            this.$message.error('未输入规格型号')
            return
         }
         if (!this.formData.managementNumber) {
            this.$message.error('未输入管理编号')
            return
         }
         if (!this.formData.activationDate) {
            this.$message.error('未输入启用日期')
            return
         }
         if (this.formData.deviceStatus === '' || this.formData.deviceStatus === null) {
            this.$message.error('未选择当前状态')
            return
         }
         if (!this.formData.calibrationDate) {
            this.$message.error('未输入校准周期（月）')
            return
         }
         delete this.formData.createTime
         delete this.formData.updateTime
         delete this.formData.createUser
         delete this.formData.updateUser
         this.formData.insProductIds = this.formData.insProductIds ? this.formData.insProductIds.join() : ''
         this.upLoad = true;
         this.formData.authorizedPerson = JSON.stringify(this.formData.authorizedPerson)
         console.log('this.formData',this.formData);
         this.$axios.post(this.$api.deviceScope.upDeviceParameter, this.formData, {
            headers: {
               'Content-Type': 'application/json'
            }
         }).then(res => {
            if (res.code === 201) {
               this.upLoad = false
               return
            }
            this.$message.success('修改成功')
            this.upLoad = false
            this.refreshTable('page')
            this.dialogVisible = false
         }).catch(e => {
            this.$message.error('修改失败')
            this.dialogVisible = false
            this.upLoad = false
         })
      },
      submitForm2() {
         if (!this.formData2.deviceName) {
            this.$message.error('未输入仪器名称')
            return
         }
         if (!this.formData2.enDeviceName) {
            this.$message.error('未输入仪器名称EN')
            return
         }
         if (!this.formData2.specificationModel) {
            this.$message.error('未输入规格型号')
            return
         }
         if (!this.formData2.managementNumber) {
            this.$message.error('未输入管理编号')
            return
         }
         if (!this.formData2.activationDate) {
            this.$message.error('未输入启用日期')
            return
         }
         if (!this.formData2.deviceStatus) {
            this.$message.error('未选择当前状态')
            return
         }
         if (!this.formData2.calibrationDate) {
            this.$message.error('输入校准周期（月）')
            return
         }
         this.upLoad2 = true;
         this.formData2.insProductIds = this.formData2.insProductIds.join()
         this.$axios.post(this.$api.deviceScope.addDeviceParameter, this.formData2, {
            headers: {
               'Content-Type': 'application/json'
            }
         }).then(res => {
            if (res.code === 201) {
               this.upLoad2 = false
               return
            }
            this.$message.success('提交成功')
            this.upLoad2 = false
            this.refreshTable('page')
            this.dialogVisible2 = false
            this.formData2 = {
               imageUpload: '',
               imageName: ''
            }
         }).catch(e => {
            this.$message.error('提交失败')
            this.dialogVisible2 = false
            this.upLoad2 = false
         })
      },
      handleConfig(row) {
         let list = []
      if(row.insProductItem){
        list = row.insProductItem.split(';')
    // 权限分配
    getPower(radio) {
      let power = JSON.parse(sessionStorage.getItem("power"));
      let up = false;
      let del = false;
      let add = false;
      let config = false;
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == "upDeviceParameter") {
          up = true;
        }
        if (power[i].menuMethod == "delDeviceParameter") {
          del = true;
        }
        if (power[i].menuMethod == "addDeviceParameter") {
          add = true;
        }
        // if (power[i].menuMethod == "saveDataAcquisitionConfiguration") {
        //   config = true;
        // }
      }
         let list2 = []
         list.map((item) => {
      // if (!config) {
      //   this.componentData.do.splice(2, 1);
      // }
      if (!up) {
        this.componentData.do.splice(1, 1);
      }
      if (!del) {
        this.componentData.do.splice(0, 1);
      }
      this.addPower = add;
    },
    // 获取字典
    selectEnumByCategory() {
      this.$axios
        .post(this.$api.enums.selectEnumByCategory, {
          category: "设备状态"
        })
        .then(res => {
          this.deviceStatusList = res.data;
          this.deviceStatusList.forEach(a => {
            if (!isNaN(a.value)) {
              a.value = parseInt(a.value);
            }
          });
          this.componentData.tagField.deviceStatus.select = res.data;
        });
      this.$axios
        .post(this.$api.enums.selectEnumByCategory, {
          category: "设备分类"
        })
        .then(res => {
          this.equipmentList = res.data;
        });
    },
    // 获取负责人列表
    selectDevicePrincipal() {
      this.$axios.get(this.$api.deviceScope.selectDevicePrincipal).then(res => {
        let data = [];
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          });
        });
        this.responsiblePersonList = data;
        this.authorizerList = data;
        this.componentData.tagField.equipmentManager = data;
        this.componentData.tagField.authorizedPerson = data;
      });
    },
    getInsProductIds() {
      this.$axios.post(this.$api.capacityScope.getInsProduction).then(res => {
        this.componentData.tagField.insProductIds.select = [];
        this.componentData.selectField.insProductIds.select = [];
        this.options = res.data.map((m, i) => {
          m.id = m.name;
          let children = m.children.map(n => {
            n.label = n.name;
            n.value = n.id;
            return n;
          });
          this.componentData.tagField.insProductIds.select = [
            ...this.componentData.tagField.insProductIds.select,
            ...children
          ];
          this.componentData.selectField.insProductIds.select = [
            ...this.componentData.selectField.insProductIds.select,
            ...children
          ];
          return m;
        });
        this.options.forEach(item => {
          if (item.children.length == 0) {
            item.children = null;
          } else {
            item.children.forEach(m => {
              if (m.children.length == 0) {
                m.children = null;
              } else {
                m.children.forEach(n => {
                  if (n.children && n.children.length == 0) {
                    n.children = null;
                  }
                });
              }
            });
          }
        });
      });
    },
    handleClose() {
      this.formData = {};
      this.formData2 = {
        imageUpload: "",
        imageName: ""
      };
      this.dialogVisible = false;
      this.upLoad = false;
    },
    handleClose2() {
      this.formData = {};
      this.formData2 = {
        imageUpload: "",
        imageName: ""
      };
      this.dialogVisible2 = false;
      this.upLoad = false;
    },
    selectAllByOne(row) {
      this.isUp = true;
      //打开弹框
      this.dialogVisible = true;
      //row = 点击对应行值
      //复制给formData
      this.formData = this.HaveJson(row);
      console.log(row.insProductIds + "valll");
      this.formData.insProductIds = row.insProductIds
        ? row.insProductIds.split(",")
        : [];
    },
    isUpdate(row) {
      //修改  isUp 为档案修改
      this.isUp = false;
      //打开弹框
      this.dialogVisible = true;
      //row = 点击对应行值一行值
      //复制给formData
      this.formData = this.HaveJson(row);
      if (typeof row.insProductIds === "number") {
        row.insProductIds = row.insProductIds + "";
      }
      this.formData.insProductIds = row.insProductIds
        ? row.insProductIds.split(",")
        : [];
      // 将时间格式为yyyy-MM-dd 进行转换
      const dateRegex = /^\d{4}-\d{2}-\d{2}$/;
      Object.keys(this.formData).forEach(key => {
        if (dateRegex.test(this.formData[key])) {
          this.formData[key] = `${this.formData[key]} 00:00:00`;
        }
      });
    },
    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();
    },
    // 上传图片成功
    handleSuccessUpImg(response) {
      if (response.code == 200) {
        this.formData.imageUpload = response.data.url;
        this.formData.imageName = response.data.name;
      }
    },
    handleSuccessUpImg2(response) {
      if (response.code == 200) {
        this.$nextTick(() => {
          this.formData.imageUpload = response.data.url;
          this.formData.imageName = response.data.name;
          this.formData2.imageUpload = response.data.url;
          this.formData2.imageName = response.data.name;
        });
      }
    },
    submitForm() {
      if (!this.formData.deviceName) {
        this.$message.error("未输入仪器名称");
        return;
      }
      if (!this.formData.enDeviceName) {
        this.$message.error("未输入仪器名称EN");
        return;
      }
      if (!this.formData.specificationModel) {
        this.$message.error("未输入规格型号");
        return;
      }
      if (!this.formData.managementNumber) {
        this.$message.error("未输入管理编号");
        return;
      }
      if (!this.formData.activationDate) {
        this.$message.error("未输入启用日期");
        return;
      }
      if (
        this.formData.deviceStatus === "" ||
        this.formData.deviceStatus === null
      ) {
        this.$message.error("未选择当前状态");
        return;
      }
      if (!this.formData.calibrationDate) {
        this.$message.error("未输入校准周期（月）");
        return;
      }
      delete this.formData.createTime;
      delete this.formData.updateTime;
      delete this.formData.createUser;
      delete this.formData.updateUser;
      this.formData.insProductIds = this.formData.insProductIds
        ? this.formData.insProductIds.join()
        : "";
      this.upLoad = true;
      this.formData.authorizedPerson = JSON.stringify(
        this.formData.authorizedPerson
      );
      console.log("this.formData", this.formData);
      this.$axios
        .post(this.$api.deviceScope.upDeviceParameter, this.formData, {
          headers: {
            "Content-Type": "application/json"
          }
        })
        .then(res => {
          if (res.code === 201) {
            this.upLoad = false;
            return;
          }
          this.$message.success("修改成功");
          this.upLoad = false;
          this.refreshTable("page");
          this.dialogVisible = false;
        })
        .catch(e => {
          this.$message.error("修改失败");
          this.dialogVisible = false;
          this.upLoad = false;
        });
    },
    submitForm2() {
      if (!this.formData2.deviceName) {
        this.$message.error("未输入仪器名称");
        return;
      }
      if (!this.formData2.enDeviceName) {
        this.$message.error("未输入仪器名称EN");
        return;
      }
      if (!this.formData2.specificationModel) {
        this.$message.error("未输入规格型号");
        return;
      }
      if (!this.formData2.managementNumber) {
        this.$message.error("未输入管理编号");
        return;
      }
      if (!this.formData2.activationDate) {
        this.$message.error("未输入启用日期");
        return;
      }
      if (!this.formData2.deviceStatus) {
        this.$message.error("未选择当前状态");
        return;
      }
      if (!this.formData2.calibrationDate) {
        this.$message.error("输入校准周期（月）");
        return;
      }
      this.upLoad2 = true;
      this.formData2.insProductIds = this.formData2.insProductIds.join();
      this.$axios
        .post(this.$api.deviceScope.addDeviceParameter, this.formData2, {
          headers: {
            "Content-Type": "application/json"
          }
        })
        .then(res => {
          if (res.code === 201) {
            this.upLoad2 = false;
            return;
          }
          this.$message.success("提交成功");
          this.upLoad2 = false;
          this.refreshTable("page");
          this.dialogVisible2 = false;
          this.formData2 = {
            imageUpload: "",
            imageName: ""
          };
        })
        .catch(e => {
          this.$message.error("提交失败");
          this.dialogVisible2 = false;
          this.upLoad2 = false;
        });
    },
    handleConfig(row) {
      let list = [];
      if (row.insProductItem) {
        list = row.insProductItem.split(";");
      }
      let list2 = [];
      list.map(item => {
        const obj = Object.assign({
          deviceId: row.id,
               insProductItem: item,
            })
            list2.push(obj)
         })
         this.tableList = list2
         this.deviceId = row.id
      this.$nextTick(()=>{
        this.showData = true
      })
      },
      closeDataVue() {
      this.clickSidebar(this.clickNodeVal)
         this.showData = false
      },
      submitForm3() {
         if (!this.configForm.ip) {
            this.$message.error('请填写IP');
            return
         }
         if (!this.configForm.collectUrl) {
            this.$message.error('请填写采集地址');
            return
         }
         if (!this.configForm.storageUrl) {
            this.$message.error('请填写储存地址');
            return
         }
         if (!this.configForm.refer) {
            this.$message.error('请填写参照');
            return
         }
         if (!this.configForm.x) {
            this.$message.error('请填写X');
            return
         }
         if (!this.configForm.y) {
            this.$message.error('请填写Y');
            return
         }
          insProductItem: item
        });
        list2.push(obj);
      });
      this.tableList = list2;
      this.deviceId = row.id;
      this.$nextTick(() => {
        this.showData = true;
      });
    },
    closeDataVue() {
      this.clickSidebar(this.clickNodeVal);
      this.showData = false;
    },
    submitForm3() {
      if (!this.configForm.ip) {
        this.$message.error("请填写IP");
        return;
      }
      if (!this.configForm.collectUrl) {
        this.$message.error("请填写采集地址");
        return;
      }
      if (!this.configForm.storageUrl) {
        this.$message.error("请填写储存地址");
        return;
      }
      if (!this.configForm.refer) {
        this.$message.error("请填写参照");
        return;
      }
      if (!this.configForm.x) {
        this.$message.error("请填写X");
        return;
      }
      if (!this.configForm.y) {
        this.$message.error("请填写Y");
        return;
      }

         this.upLoad3 = true
         this.$axios.post(this.$api.deviceScope.numberCollect, this.configForm, {
            headers: {
               'Content-Type': 'application/json'
            }
         }).then(res => {
            this.upLoad3 = false
            if (res.code === 201) {
               return
            }
            this.$message.success('操作成功')
            this.refreshTable('page')
            this.dialogVisible3 = false
         }).catch(e => {
            this.$message.error('操作失败')
            this.dialogVisible3 = false
            this.upLoad3 = false
         })
      },
      // 点击侧边栏刷新
      clickSidebar(clickNodeVal) {
         this.laboratoryNameIsNull = false
         // 是否存在value，存在value代表为三级
         if (!clickNodeVal.value) {
            this.list = [];
            this.componentData.entity.laboratoryName = null
            this.componentData.entity.storagePoint = null
            // 等于1代表为树的一级，label为部门
            if (clickNodeVal.label == '其他') {
            this.laboratoryNameIsNull = true
            this.refreshTable('page')
            return
            }
            if (clickNodeVal.level == 1) {
            this.componentData.entity.laboratoryName = clickNodeVal.label
            // 等于二级。label为存储地点
            } else if (clickNodeVal.level == 2) {
          // 其他表示没有配置实验室，只配置了地点
          if (clickNodeVal.parent.label == '其他') {
            this.laboratoryNameIsNull = true
          } else {
            this.componentData.entity.laboratoryName = clickNodeVal.parent.label
      this.upLoad3 = true;
      this.$axios
        .post(this.$api.deviceScope.numberCollect, this.configForm, {
          headers: {
            "Content-Type": "application/json"
          }
          this.componentData.entity.storagePoint = clickNodeVal.label
            }
            this.refreshTable('page')
         }
      }
   },
   watch: {
        })
        .then(res => {
          this.upLoad3 = false;
          if (res.code === 201) {
            return;
          }
          this.$message.success("操作成功");
          this.refreshTable("page");
          this.dialogVisible3 = false;
        })
        .catch(e => {
          this.$message.error("操作失败");
          this.dialogVisible3 = false;
          this.upLoad3 = false;
        });
    },
    // 点击侧边栏刷新
    clickSidebar(clickNodeVal) {
      this.laboratoryNameIsNull = false;
      // 是否存在value，存在value代表为三级
      if (!clickNodeVal.value) {
        this.list = [];
        this.componentData.entity.laboratoryName = null;
        this.componentData.entity.storagePoint = null;
        // 等于1代表为树的一级，label为部门
        if (clickNodeVal.label == "其他") {
          this.laboratoryNameIsNull = true;
          this.refreshTable("page");
          return;
        }
        if (clickNodeVal.level == 1) {
          this.componentData.entity.laboratoryName = clickNodeVal.label;
          // 等于二级。label为存储地点
        } else if (clickNodeVal.level == 2) {
          // 其他表示没有配置实验室，只配置了地点
          if (clickNodeVal.parent.label == "其他") {
            this.laboratoryNameIsNull = true;
          } else {
            this.componentData.entity.laboratoryName =
              clickNodeVal.parent.label;
          }
          this.componentData.entity.storagePoint = clickNodeVal.label;
        }
        this.refreshTable("page");
      }
    }
  },
  watch: {
    // 监听点击el-tree的数据，进行数据刷新
    clickNodeVal(newVal) {
      this.clickSidebar(newVal)
      this.clickSidebar(newVal);
    }
  }
}
};
</script>

<style scoped>
.role_manage {
   width: 100%;
   height: 100%;
  width: 100%;
  height: 100%;
}

.title {
   line-height: 15px;
  line-height: 15px;
}

.search {
   display: flex;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
}

.search_thing {
   width: 17em;
   display: flex;
   align-items: center;
  width: 17em;
  display: flex;
  align-items: center;
}

.search_label {
   width: 110px;
   font-size: 14px;
   text-align: right;
  width: 110px;
  font-size: 14px;
  text-align: right;
}

.search_input {
   width: calc(100% - 110px);
  width: calc(100% - 110px);
}

.table {
   margin-top: 12px;
   background-color: #fff;
   height: calc(100vh - 17em);
  margin-top: 12px;
  background-color: #fff;
  height: calc(100vh - 17em);
}

.el-form-item {
   margin-bottom: 16px;
  margin-bottom: 16px;
}

.picName {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   word-break: break-all;
   width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
  width: 120px;
}
</style>