实验室管理设备台账完善

Goldennfish

2023-07-28 6cd44812a96026d6c6d0fff397eb2662c75fedd3

 src/views/laboratory/ledger/index.vue

@@ -2,55 +2,60 @@
  <div class="ledger-main">
    <div class="page-header-search">
      <div class="search-bar">
        <el-form ref="form" inline="true" :model="searchData">
        <el-form ref="form" :inline="true" :model="searchData">
          <el-form-item>
            <el-input
              placeholder="请输入编号/设备名称/型号规格"
              v-model="searchData.keyword"
              placeholder="请输入编号/设备名称/型号规格"
            >
              <i slot="prefix" class="el-input__icon el-icon-search" />
            </el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary">查询</el-button>
            <el-button type="primary" plain>重置</el-button>
            <el-button type="primary" @click="filterTableData">查询</el-button>
            <el-button type="primary" plain @click="resetBtn">重置</el-button>
            <!-- <el-button type="text">高级搜索<i class="el-icon-arrow-down el-icon--right" /></el-button> -->
          </el-form-item>
        </el-form>
      </div>
      <div class="serve-btn">
        <el-button type="primary" icon="el-icon-plus">新增人员</el-button>
        <el-button type="primary" icon="el-icon-plus" @click="addDrawerVisible = true">新增仪器</el-button>
      </div>
    </div>
    <div class="content-main">
      <div class="library-bom">
        <el-input
          v-model="filterText"
          placeholder="输入关键字进行过滤"
        />
        <div class="bom-item-search">
          <el-row>
            <el-col :span="19">
              <el-input
                v-model="filterText"
                placeholder="输入关键字进行过滤"
              />
            </el-col>
            <el-col :span="5">
              <el-button type="primary" size="small" @click="addClassVisible = true"><i class="el-icon-plus" /></el-button>
            </el-col>
          </el-row>
        </div>
        <el-tree
          ref="tree"
          class="filter-tree"
          :data="data"
          ref="classTree"
          :data="classTree"
          :props="defaultProps"
          default-expand-all
          :default-expand-all="true"
          :filter-node-method="filterNode"
        >

        </el-tree>
          @node-click="nodeClickHandler"
        />
      </div>
      <div class="library-table">
        <div class="table-header">
          <div class="search-bar">
            <el-radio-group v-model="radioValue">
              <el-radio-button label="全部" />
              <el-radio-button label="运行" />
              <el-radio-button label="待机" />
              <el-radio-button label="检修" />
              <el-radio-button label="故障" />
              <el-radio-button label="报废" />
            <el-radio-group v-model="radioValue" @change="getConditionTable">
              <!-- <el-radio-button label="0">全部</el-radio-button> -->
              <el-radio-button v-for="item in conditionsOptions" :key="item.value" :label="item.value">
                {{ item.label }}
              </el-radio-button>
            </el-radio-group>
            <el-checkbox :style="{'marginLeft':'12px'}" v-model="isOut">已过期</el-checkbox>
            <el-checkbox v-model="isOut" @change="getExpireTable" :style="{'marginLeft':'12px'}">已过期</el-checkbox>
          </div>
          <div class="serve-btn">
            <!-- <el-button type="primary" icon="el-icon-plus">新增人员</el-button> -->
@@ -58,116 +63,690 @@
        </div>
        <div class="table-box">
          <el-table
            ref="personnerlTable"

            ref="equipmentTable"
            node-key="father_name"
            :cell-style="{textAlign: 'center'}"
            :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
            :data="personnerlTable"
            :data="equipmentTable"
            style="width: 100%"
          >
            <el-table-column
              prop="roleName"
              type="index"
              label="序号"
              min-width="90"
            />
            <el-table-column
              prop="rolePermissions"
              prop="equipment_code"
              label="仪器设备编号"
              min-width="150"
              min-width="200"
            />
            <el-table-column
              prop="age"
              prop="equipment_name"
              label="仪器设备名称"
              min-width="150"
            />
            <el-table-column
              prop="creatTime"
              prop="specifications_models"
              label="规格型号"
              min-width="150"
            />
            <el-table-column
              prop="phone"
              label="上次计量时间"
              prop="name"
              label="保管人"
              min-width="200"
            />
            <el-table-column
              prop="mailbox"
              label="上次计量单位"
              prop="termValidity"
              label="计量截止有效期"
              min-width="200"
            />
            <el-table-column
              prop="mailbox"
              label="截止有效期"
              min-width="200"
            />
            <el-table-column
              prop="mailbox"
              label="计量周期"
              min-width="200"
            />
            <el-table-column
              prop="incumbentStatus"
              prop="conditions"
              label="设备状态"
              min-width="120"
              :filters="[{ text: 0, value: 0 }, { text: 1, value: 1 }]"
              :filter-method="filterTag"
              filter-placement="bottom-end"
            >
              <template slot-scope="scope">
                <el-tag
                  :type="scope.row.businessStatus === 0 ? 'primary' : 'success'"
                  :type="scope.row.conditions === 0 ? 'primary' : 'success'"
                  disable-transitions
                >{{ scope.row.businessStatus === 0 ? '未同意' : '已同意' }}</el-tag>
                >{{ scope.row.conditions | conditionsFilter }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column
              prop="storage_place"
              label="存放地"
              min-width="200"
            />

            <el-table-column
              label="操作"
              min-width="120"
              :fixed="true"
              fixed="right"
            >
              <template slot-scope="scope" >
                <el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
                <!-- <el-button type="text" size="small">编辑</el-button> -->
              <template slot-scope="scope">
                <el-button type="text" size="small" @click="openDetail(scope.row)">编辑</el-button>
                <el-button type="text" size="small" @click="clickDelete(scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
          <!-- 弹出表单页 -->
          <div>
            <!-- 添加分类 -->
            <el-dialog title="添加分类" :visible.sync="addClassVisible" width="33%">
              <el-form :model="addTreeForm">
                <el-form-item label="分类名称" label-width="100px">
                  <el-input v-model="addTreeForm.name" autocomplete="off" />
                </el-form-item>
                <el-form-item label="父级分类" label-width="100px">
                  <el-select v-model="addTreeForm.type" placeholder="请选择">
                    <el-option label="原材料" value="0" />
                    <el-option label="电线电缆" value="1" />
                  </el-select>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="addClassVisible = false">取 消</el-button>
                <el-button type="primary">确 定</el-button>
              </div>
            </el-dialog>
          </div>
          <div>
            <el-pagination
              :current-page="currentPage"
              :page-sizes="[10, 15, 20, 25]"
              :page-size="pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="total"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[100, 200, 300, 400]"
              :page-size="100"
              layout="total, sizes, prev, pager, next, jumper"
              :total="400"
            />
          </div>
        </div>
      </div>
    </div>
    <!-- 仪器详情-->
    <el-drawer
      title="仪器设备详情"
      :visible.sync="detailDrawer"
      size="80%"
      class="detailDrawer"
      @close="closeDetailDrawer"
    >
      <div>
        <div class="detail-info">
          <div class="tips-main">
            <div class="tips">
              <span />
              <div>基本信息</div>
            </div>
            <div class="tips-btn">
              <el-button type="primary" @click="addDrawerVisible = true">编辑</el-button>
            </div>
          </div>
          <div class="message">
            <div class="message-item"><span><i class="el-icon-edit" />所属分类：{{ equipmentDetail.classifyId }}</span></div>
            <div class="message-item">
              <span><i class="el-icon-edit" />创建人：{{ equipmentDetail.createUserId }}</span>
              <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" /></el-tag>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />建档日期：{{ equipmentDetail.acceptanceDate }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />设备编号：{{ equipmentDetail.equipmentCode }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />型号规格：{{ equipmentDetail.specificationsModels }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />测量范围：{{ equipmentDetail.measuringRange }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />不确定度/误差：{{ equipmentDetail.errorRate }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />生产厂家：{{ equipmentDetail.manufacturer }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />存放地点：{{ equipmentDetail.storagePlace }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />到货日期：{{ equipmentDetail.arrivalDate }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />验收日期：{{ equipmentDetail.acceptanceDate }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />保管人：{{ equipmentDetail.userId }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />是否支持数采：{{ equipmentDetail.whetherDataAcquisition==1 ? '支持': '不支持' }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />仪器设备计量：{{ equipmentDetail.equipmentMeasurement==1 ? '需要': '不需要' }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />计量周期：{{ equipmentDetail.termValidity }}</span>
            </div>
            <div class="message-item">
              <span><i class="el-icon-edit" />描述：{{ equipmentDetail.descriptiveness }}</span>
            </div>
          </div>
        </div>
        <el-tabs v-model="activeTabsName">
          <el-tab-pane label="设备码点" name="codePoints">
            <el-button v-show="!codePointesTableStatus" :style="{marginBottom: '18px'}" @click="addCodePoints">新增设备码点</el-button>
            <div v-show="codePointesTableStatus" :style="{marginBottom: '18px'}" class="btns">
              <el-button @click="addNewCodePoints">添加</el-button>
              <el-button @click="saveCodePoins">保存</el-button>
              <el-button @click="closeCodePoins">取消</el-button>
            </div>

            <el-table
              ref="codePointsTable"
              :cell-style="{textAlign: 'center'}"
              :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
              :data="codePointsTable"
              style="width: 100%"
            >
              <el-table-column
                type="index"
                label="序号"
                min-width="90"
              />
              <el-table-column
                prop="equipmentPoint"
                label="码点编码"
                min-width="150"
              >
                <template slot-scope="scope">
                  <span v-show="!codePointesTableStatus">{{ scope.row.equipmentPoint }}</span>
                  <el-input v-show="codePointesTableStatus" v-model="scope.row.equipmentPoint" />
                </template>
              </el-table-column>

              <el-table-column
                prop="equipmentPointName"
                label="码点名称"
                min-width="150"
              >
                <template slot-scope="scope">
                  <span v-show="!codePointesTableStatus">{{ scope.row.equipmentPointName }}</span>
                  <el-input v-show="codePointesTableStatus" v-model="scope.row.equipmentPointName" />
                </template>
              </el-table-column>
              <el-table-column
                prop="unit"
                label="单位"
                min-width="150"
              >
                <template slot-scope="scope">
                  <span v-show="!codePointesTableStatus">{{ scope.row.unit }}</span>
                  <el-input v-show="codePointesTableStatus" v-model="scope.row.unit" />
                </template>
              </el-table-column>
              <el-table-column
                prop="name"
                label="更新人"
                min-width="100"
              />
              <el-table-column
                prop="updateTime"
                label="更新日期"
                min-width="120"
              />
              <el-table-column
                prop="descriptiveness"
                label="描述"
                min-width="200"
              >
                <template slot-scope="scope">
                  <span v-show="!codePointesTableStatus">{{ scope.row.descriptiveness }}</span>
                  <el-input v-show="codePointesTableStatus" v-model="scope.row.descriptiveness" />
                </template>
              </el-table-column>

            </el-table>
          </el-tab-pane>
          <el-tab-pane label="计量信息" name="measure">
            <el-button :style="{marginBottom: '18px'}" @click="measureFormVisible = true">新增计量信息</el-button>
            <el-table
              ref="measureTable"
              :cell-style="{textAlign: 'center'}"
              :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
              :data="measureTable"
              style="width: 100%"
            >
              <el-table-column
                type="index"
                label="序号"
                min-width="90"
              />
              <el-table-column
                prop="name"
                label="负责人"
                min-width="200"
              />
              <el-table-column
                prop="measurement_unit"
                label="计量单位"
                min-width="150"
              />
              <el-table-column
                prop="beginDate"
                label="开始日期"
                min-width="150"
              />
              <el-table-column
                prop="endDate"
                label="结束日期"
                min-width="150"
              />
              <el-table-column
                prop="performance_index"
                label="性能指标"
                min-width="200"
              />
              <el-table-column
                prop="uncertainty"
                label="不确定度"
                min-width="200"
              />
              <el-table-column
                prop="conditions"
                label="结果"
                min-width="120"
              >
                <template slot-scope="scope">
                  {{ scope.row.result }}
                  <!-- <el-tag
                    :type="scope.row.result === 0 ? 'primary' : 'success'"
                    disable-transitions
                  >{{ scope.row.result === 0 ? '未同意' : '已同意' }}</el-tag> -->
                </template>
              </el-table-column>
              <el-table-column
                prop="remarks"
                label="备注"
                min-width="200"
              />
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-drawer>
    <!-- 添加仪器/修改仪器信息 -->
    <el-drawer
      ref="addDrawer"
      :title="equipmentDetail.id?'修改仪器设备信息':'新增仪器设备'"
      :append-to-body="true"
      :visible.sync="addDrawerVisible"
      class="addDrawer"
      size="40%"
      @close="closeAddOrChangeDrawer"
    >
      <div class="demo-drawer__content">
        <el-form label-position="top" :model="equipmentform">
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="所属分类：" label-width="80">
                <el-cascader v-model="equipmentform.classifyId" :options="classTree" :show-all-levels="false" />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="设备编号：" label-width="80">
                <el-input v-model="equipmentform.equipmentCode" autocomplete="off" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="仪器设备名称：" label-width="80">
                <el-input v-model="equipmentform.equipmentName" autocomplete="off" />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="状态：" label-width="80">
                <el-select
                  v-model="equipmentform.conditions"
                  clearable
                  filterable
                  :allow-create="true"
                  placeholder="请选择仪器设备状态"
                  style="width:100%"
                >
                  <el-option
                    v-for="item in conditionsOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="型号规格：" label-width="80">
                <el-input v-model="equipmentform.specificationsModels" autocomplete="off" />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="测量范围：" label-width="80">
                <el-input v-model="equipmentform.measuringRange" autocomplete="off" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="不确定度/准确度/最大允许误差：" label-width="80">
                <el-input v-model="equipmentform.errorRate" autocomplete="off" />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="生产厂家：" label-width="80">
                <el-input v-model="equipmentform.manufacturer" autocomplete="off" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="存放地点：" label-width="80">
                <el-input v-model="equipmentform.storagePlace" autocomplete="off" />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="到货日期：" label-width="80">
                <el-date-picker
                  v-model="equipmentform.arrivalDate"
                  type="date"
                  placeholder="请选择到货日期"
                  style="width:100%"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="验收日期：" label-width="80">
                <el-date-picker
                  v-model="equipmentform.acceptanceDate"
                  type="date"
                  placeholder="请选择验收日期"
                  style="width:100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="保管人：" label-width="80">
                <el-select
                  v-model="equipmentform.userId"
                  clearable
                  filterable
                  :allow-create="true"
                  placeholder="请选择保管人"
                  style="width:100%"
                >
                  <el-option
                    v-for="item in userOpetions"
                    :key="item.id"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="是否支持数采：" label-width="80">
                <el-radio v-model="equipmentform.whetherDataAcquisition" :label="1">支持</el-radio>
                <el-radio v-model="equipmentform.whetherDataAcquisition" :label="0">不支持</el-radio>
              </el-form-item>
            </el-col>
            <el-col :span="11">
              <el-form-item label="仪器设备计量：" label-width="80">
                <el-radio v-model="equipmentform.equipmentMeasurement" :label="1">需要</el-radio>
                <el-radio v-model="equipmentform.equipmentMeasurement" :label="0">不需要</el-radio>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-show="equipmentform.equipmentMeasurement===1" :gutter="50">
            <el-col :span="12">
              <el-form-item label="计量截止有效期：" label-width="80">
                <el-input v-model="equipmentform.termValidity" type="number" />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="50">
            <el-col :span="11">
              <el-form-item label="描述：" label-width="80">
                <el-input
                  v-model="equipmentform.descriptiveness"
                  type="textarea"
                  :rows="2"
                  placeholder="请输入内容"
                  style="width:217%"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div class="demo-drawer__footer">
          <el-button class="el-button--default" @click="addDrawerVisible = false">取 消</el-button>
          <el-button type="primary" class="el-button--primary el-button--medium" @click="addNewEquipment">确 定</el-button>
        </div>
      </div>
    </el-drawer>
    <!-- 新增计量信息弹窗 -->
    <el-dialog class="measureForm" title="新增计量" :visible.sync="measureFormVisible">
      <el-form label-position="top" :model="measureForm">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="负责人">
              <el-select
                v-model="measureForm.userId"
                clearable
                filterable
                :allow-create="true"
                placeholder="负责人"
                style="width:100%"
              >
                <el-option
                  v-for="item in userOpetions"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="计量单位">
              <el-input v-model="measureForm.measurementUnit" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="检定有效期">
              <el-date-picker
                v-model="measureForm.date"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="不确定度">
              <el-input v-model="measureForm.uncertainty" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="结果">
              <el-select
                v-model="measureForm.result"
                clearable
                filterable
                :allow-create="true"
                placeholder="负责人"
                style="width:100%"
              >
                <el-option
                  v-for="item in resultOptions"
                  :key="item.id"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="性能指标">
              <el-input
                v-model="measureForm.performanceIndex"
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input
                v-model="measureForm.remarks"
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="">
              <el-upload
                class="upload-demo"
                action="#"
                :on-change="handleUpload"
                :auto-upload="false"
              >
                <el-button size="small" type="primary">点击上传</el-button>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="addMeasure">确 定</el-button>

        <el-button @click="measureFormVisible = false">取 消</el-button>
      </span>
    </el-dialog>
    <!-- 删除仪器弹出框 -->
    <el-dialog
      title="提示"
      :visible.sync="deletedialogVisible"
      width="30%"
      :before-close="handleClose">
      <span>确定删除该仪器吗？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="deletedialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="deleteInstrument">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { getClassifyList, getInstrumentList,
  addInstrumentUser, addInstrument, getInstrumentDetail,
  getEquipmentPointList, addEquipmentPoint,
  getMetricalInformationList, changeInstrument, addMetricalInformation, deleteInstrument } from '@/api/laboratory/ledger'
import { parseTime } from '@/utils/index'
export default {
  filters: {
    conditionsFilter(value) {
      let returnValue = null
      switch (+value) {
        case 1:
          returnValue = '运行'
          break
        case 2:
          returnValue = '故障'
          break
        case 3:
          returnValue = '报修'
          break
        case 4:
          returnValue = '检修'
          break
        case 5:
          returnValue = '待机'
          break
      }
      return returnValue
    }
  },
  data() {
    return {
      // 表格数据
      data: [{
        id: 1,
        label: '一级 1',
        children: [{
          id: 4,
          label: '二级 1-1',
          children: [{
            id: 9,
            label: '三级 1-1-1'
          }, {
            id: 10,
            label: '三级 1-1-2'
          }]
        }]
      }],
      // 用户下拉框配置项
      userOpetions: [],
      // 仪器状态配置项
      conditionsOptions: [
        {
          label: '全部',
          value: 0
        },
        {
          label: '运行',
          value: 1
        },
        {
          label: '故障',
          value: 2
        },
        {
          label: '报修',
          value: 3
        },
        {
          label: '检修',
          value: 4
        },
        {
          label: '待机',
          value: 5
        }
      ],
      // 计量状态配置项
      resultOptions: [
        {
          label: '合格',
          value: 1
        },
        {
          label: '校正后可用',
          value: 2
        },
        {
          label: '不合格',
          value: 3
        }

      ],
      // 分类tree数据，分类配置项
      classTree: [],
      // 添加分类参数
      addTreeForm: {},
      // tree默认值
      defaultProps: {
        children: 'children',
@@ -178,26 +757,392 @@
        keyword: ''
      },
      // 表格搜索单选值
      radioValue: '全部',
      radioValue: '0',
      // 表格搜索已过期
      isOut: false
      // 是否过期
      isOut: false,
      // 控制添加分类模态框显示
      addClassVisible: false,
      // 控制新增计量模态框显示
      measureFormVisible: false,
      // 控制删除仪器模态框显示
      deletedialogVisible: false,
      // 控制添加修改仪器抽屉的显示
      addDrawerVisible: false,
      // 添加修改仪器参数对象
      equipmentform: {
        acceptanceDate: '', // 验收日期
        arrivalDate: '', // 到货日期
        classifyId: '', // 所属分类
        conditions: '', // 状态
        descriptiveness: '', // 描述
        equipmentCode: '', // 设备编号
        equipmentMeasurement: 1, // 仪器设备计量
        equipmentName: '', // 仪器设备名称
        errorRate: '', // 不确定度/准确度/最大允许误差
        userId: '', // 保管人
        manufacturer: '', // 生产厂家
        measuringRange: '', // 测量范围
        specificationsModels: '', // 型号规格
        storagePlace: '', // 存放地点
        whetherDataAcquisition: 1 // 是否支持数采
      },
      // 控制设备仪器详情抽屉显示
      detailDrawer: false,
      // 设备数据列表
      equipmentTable: [],
      // 分页参数
      currentPage: 1,
      pageSize: 10,
      total: 0,
      // 码点表格
      codePointsTable: [
        {
          'unit': 'mm',
          'descriptiveness': '疯了，做不了',
          'equipmentPoint': 'Area-1',
          'name': '小小',
          'updateTime': '2023-07-24',
          'id': 1,
          'equipmentPointName': '导体屏蔽（壁厚面积）'
        }
      ],
      // 计量信息表
      measureTable: [],
      // 添加计量信息参数对象
      measureForm: {},
      activeTabsName: 'codePoints',
      // 码点表格的状态：数据展示false/新增输入true
      codePointesTableStatus: false,
      // 设备详情对象
      equipmentDetail: {},
      // 过滤关键字
      filterText: '',
      // 过滤后的仪器设备表
      filterdequipmentTable: '',
      oldtableData: '',
      // 过滤不同状态设备
      conditionTable: '',
      nodeclicked: '',
      expireData: '',
      instrumentId: ''
    }
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val)
      this.$refs.classTree.filter(val)
    }
  },
  created() {
    this.getThreeData()
    this.getUserOptions()
  },
  methods: {
    // 获取分类数据
    async getThreeData() {
      const { data } = await getClassifyList()
      // console.log(data)
      this.classTree = data.map(item => {
        if (item.children) {
          item.children = item.children.map(childrenItem => {
            return { ...childrenItem, label: childrenItem.son_name, value: childrenItem.id }
          })
        }
        return { ...item, label: item.father_name, value: item.id ? item.id : item.father_name }
      })
      // console.log(this.classTree)
    },
    // 获取用户信息配置项
    async getUserOptions() {
      const { data } = await addInstrumentUser()
      this.userOpetions = data.map(item => ({ ...item, label: item.name, value: item.id }))
    },
    // 显示仪器详情
    async openDetail(row) {
      // console.log(row)
      this.detailDrawer = true
      const { data } = await getInstrumentDetail({ InstrumentId: row.id })
      this.equipmentDetail = data
      this.equipmentform = data
      console.log(this.equipmentform)
      const { data: pointList } = await getEquipmentPointList({ InstrumentId: this.equipmentDetail.id })
      this.codePointsTable = pointList
      const { data: informationList } = await getMetricalInformationList({ InstrumentId: this.equipmentDetail.id })
      this.measureTable = informationList
      console.log(informationList)
    },
    // 节点点击处理
    nodeClickHandler(data, node, element) {
      this.nodeclicked = data
      // console.log(data)
      // 只有数据中携带id才能发送查询请求
      if (data.id) {
        this.getEquipmentTable({ classifyId: data.id, pageSize: this.pageSize, pageNo: this.currentPage, whetherWhether: this.isOut })
      }
    },
    // 获取仪器列表数据
    async getEquipmentTable(ages) {
      // console.log('条件对象', ages)
      const { data } = await getInstrumentList(ages)
      console.log(data)
      this.equipmentTable = data.row
      this.total = data.total
      this.oldtableData = this.equipmentTable
    },
    // 过滤节点
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    // 改变页面数据大小
    handleSizeChange() {
      // 当前页大小
    },
    // 改变当前页
    handleCurrentChange() {
      // 当前页更改
    },
    // 显示设备码点
    addCodePoints() {
      // 添加新码点，清空原数组
      this.codePointesTableStatus = true
      this.codePointsTable = undefined
    },
    // 新增设备码点
    addNewCodePoints() {
      //
      if (!this.codePointsTable) {
        this.codePointsTable = []
      }
      const newObj = {}
      newObj.name = '小小' // 当前用户的名称
      newObj.updateTime = '2023-07-24' // 获取当前时间
      newObj.equipmentPoint = 'Area-1'
      newObj.equipmentPointName = '导体屏蔽（壁厚面积）'
      newObj.descriptiveness = ''
      newObj.unit = 'mm'
      newObj.instrumentId = this.equipmentDetail.id
      this.codePointsTable.push(newObj)
    },
    // 保存提交新增设备码点
    async saveCodePoins() {
      console.log(this.codePointsTable)
      if (!this.codePointsTable) {
        this.codePointsTable = []
      }
      if (this.codePointsTable.length === 0) return this.$message.error('请点击添加按钮添加数据')
      try {
        for (const item of this.codePointsTable) {
          const { code, data, message } = await addEquipmentPoint(item)
          console.log(data)
          if (code !== 200) throw new Error(message)
          this.$message.success('添加成功')
        }
      } catch (error) {
        this.$message.error(error)
      }
      await this.closeCodePoins()
    },
    // 取消新增设备码点
    async closeCodePoins() {
      this.codePointesTableStatus = false
      this.codePointsTable = undefined
      const { data: pointList } = await getEquipmentPointList({ InstrumentId: this.equipmentDetail.id })
      this.codePointsTable = pointList
    },
    // 点击新增仪器设备或当存在仪器详情时是修改仪器设备信息
    async addNewEquipment() {
      if (Array.isArray(this.equipmentform.classifyId)) {
        this.equipmentform.classifyId = this.equipmentform.classifyId.pop()
      }
      if (!this.equipmentDetail.id) {
        // 格式化日期
        console.log('新增仪器')
        this.equipmentform.arrivalDate = parseTime(this.equipmentform.arrivalDate, '{y}-{m}-{d}')
        this.equipmentform.acceptanceDate = parseTime(this.equipmentform.acceptanceDate, '{y}-{m}-{d}')
        // this.equipmentform.termValidity = parseTime(this.equipmentform?.termValidity, '{y}-{m}-{d}')
        console.log('新增仪器设备参数', this.equipmentform)
        try {
          const res = await addInstrument(this.equipmentform)
          console.log(res)
        } catch (error) {
          this.$message.error('添加失败')
        }
        this.$message.success('添加成功')
        this.addDrawerVisible = false
        this.equipmentform = {}
        return
      }
      console.log('修改仪器参数', this.equipmentform)
      try {
        const res = await changeInstrument(this.equipmentform)
        console.log(res)
        this.$message.success('修改成功')
        this.addDrawerVisible = false
        this.detailDrawer = false
      } catch (error) {
        this.$message.error('添加失败')
      }
    },
    // 添加计量信息
    async addMeasure() {
      // 格式化时间
      this.measureForm.instrumentId = this.equipmentDetail.id
      if (Array.isArray(this.measureForm.date)) {
        this.measureForm.beginDate = parseTime(this.measureForm.date[0], '{y}-{m}-{d}')
        this.measureForm.endDate = parseTime(this.measureForm.date[1], '{y}-{m}-{d}')
      }
      console.log(this.measureForm)
      const formData = new FormData()
      formData.append('file', this.measureForm.file?.raw, this.measureForm.file?.name)
      console.log(this.measureForm)
      for (const key in this.measureForm) {
        console.log(key)
        // if (key === 'file') return
        formData.append(key, this.measureForm[key])
      }
      console.log(formData)
      try {
        const { data } = await addMetricalInformation(formData)
        console.log(data)
        this.$message.success('添加成功')
        this.measureForm = {}
        this.measureFormVisible = false
      } catch (error) {
        this.$message.error('添加失败')
      }
    },
    // 关闭设备详情抽屉
    closeDetailDrawer() {
      this.equipmentDetail = {}
      this.codePointsTable = []
      this.measureTable = []
    },
    // 关闭添加修改设备抽屉
    closeAddOrChangeDrawer() {
      if (!this.equipmentDetail.id) {
        this.equipmentform = {}
      }
    },
    // 文件上传
    handleUpload(file, fileList) {
      // console.log(file, fileList)
      this.measureForm.file = file
    },
    // 根据输入的设备编号，设备名称或者型号规格关键字进行过滤列表
    filterTableData() {
      this.oldtableData = this.equipmentTable
      const filterdequipmentTable = this.equipmentTable.filter(item => {
        return item.equipment_code.includes(this.searchData.keyword) || item.equipment_name.includes(this.searchData.keyword) || item.specifications_models.includes(this.searchData.keyword)
      })
      this.equipmentTable = filterdequipmentTable
    },
    resetBtn() {
      this.searchData.keyword = ''
      this.equipmentTable = this.oldtableData
    },
    getConditionTable() {
      // console.log(this.radioValue)
      let filteredTable = this.oldtableData.filter(item => {
        return item.conditions === this.radioValue
      })
      // 先判断isOut
      if (this.isOut) {
        // 如果现在勾选了已过期按钮，那就从当前过滤好的列表中筛选出过期列表
        if (this.expireData.length === 0) {
          this.equipmentTable = null
        } else {
          let expireItem
          for (expireItem of this.expireData) {
            filteredTable = filteredTable.filter(item => {
              return item.equipment_code === expireItem.equipment_code
            })
          }
          this.equipmentTable = filteredTable
        }
        if (!this.radioValue) {
          this.equipmentTable = this.expireData
        }
      } else {
        this.equipmentTable = filteredTable
        if (!this.radioValue) {
          this.equipmentTable = this.oldtableData
        }
      }
    },
    async getExpireTable() {
      // const filteredTable = this.oldtableData.filter(item => {
      //   return item.conditions === this.radioValue
      // })
      if (this.isOut) {
        // 捕获点击了已过期，请求过期数据并保存
        const { data } = await getInstrumentList({ classifyId: this.nodeclicked.id, pageSize: this.pageSize, pageNo: this.currentPage, whetherWhether: this.isOut })
        this.expireData = data.row
        if (this.expireData.length === 0) {
          this.equipmentTable = null
        } else {
          if (this.radioValue !== 0) {
            let expireItem
            for (expireItem of this.expireData) {
              this.equipmentTable = this.oldtableData.filter(item => {
                console.log(this.radioValue)
                console.log('item', item)
                console.log('expireItem', expireItem)
                return item.conditions === this.radioValue && item.equipment_code === expireItem.equipment_code
              })
              console.log(this.equipmentTable)
            }
          } else {
            this.equipmentTable = this.expireData
          }
        }
      } else {
        // 捕获取消了已过期，将过期数据清空，重新更新equipmentTable
        this.expireData = ''
        this.equipmentTable = this.oldtableData.filter(item => {
          return item.conditions === this.radioValue
        })
        if (this.radioValue === 0) {
          this.equipmentTable = this.oldtableData
        }
      }
    },
    clickDelete(row) {
      this.instrumentId = row.id
      this.deletedialogVisible = true
    },
    async deleteInstrument() {
      // console.log(row.id)
      await deleteInstrument({ instrumentId: this.instrumentId })
      this.deletedialogVisible = false
    }
  }
}
</script>

<style lang="scss" scoped>
.demo-drawer__content{
  margin-left: 50px;
}
.demo-drawer__footer {
  display: flex;
  justify-content: space-between;
}

.demo-drawer__footer .el-button--default {
  background-color: #fff;
  color: #333;
  width: 45%;
  margin-bottom: 24px;
}

.demo-drawer__footer .el-button--primary {
  background-color: #409EFF;
  color: #fff;
  width: 45%;
  margin-right: 60px;
  margin-bottom: 24px;
}
.ledger-main{
  width: 100%;
  height: 100%;
@@ -237,27 +1182,23 @@
    .library-bom{
      flex: 2;
      margin-right: 12px;
      .bom-item-search{
        margin-bottom: 12px;
        ::v-deep .el-input{
          input{
            height: 33px;
            line-height: 33px;
          }
        }
      }
         .bom-item-search .el-row{
          // display: flex;
          .el-col{
            text-align: right;
           }
          }
      .el-tree {
        margin-top: 12px;
        ::v-deep .el-tree-node__content{
          height: 24px !important;
          font-size: 14px;
          display: inline-block !important;
          padding: 2px;
          color: #333;
        }
        ::v-deep .el-tree-node__content:hover{
          background: rgba(58,124,253,0.1) !important;
          // opacity: 0.31;
          border-radius: 3px;
          color: #333 !important;
        }
        ::v-deep .el-tree-node:focus>.el-tree-node__content{
          background: rgba(58,124,253,0.1) !important; 
          // opacity: 0.31;
          border-radius: 3px;
          color: #333 !important;
        }
      }
    }
    .library-table{
@@ -266,19 +1207,10 @@
      margin-left: 12px;
      display: flex;
      flex-direction: column;

      /* .table-header{
        display: flex;
        justify-content: space-between;
        .el-form-item{
          margin-bottom: 30px !important;
        }
      } */
      .table-box{
          margin-top: 30px;
          flex: 1;
          background: #fff;
          // padding: 20px 20px 10px 20px;
          display: flex;
          flex-direction: column;
          .el-table {
@@ -292,5 +1224,94 @@
      }
    }
  }

}
.addDrawer{
  ::v-deep .el-drawer__body{
      // padding: 24px !important;
      overflow-y: scroll;
      overflow-x: hidden;
    }
}
.detailDrawer{
    ::v-deep .el-drawer__body{
      padding: 24px !important;
      overflow-y: scroll;
    }
    .detail-info{
    background: #fff;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 5px 15px;
    margin: 0;
    margin-bottom: 12px;
    border-radius: 6px;
    overflow: hidden;
    .tips-main{
      padding: 10px 20px 0 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 50px;
      .tips-btn{
        margin-bottom: 10px;
      }
      .tips{
      height: 100%;
      display: flex;
      height: 24px;
      align-items: center;
      font-size: 16px;
      >span{
        display: inline-block;
        margin-right: 10px;
        width: 4px;
        height: 16px;
        background: #0077DB;
      }
      >div{
        height: 100%;
        line-height: 26px;
      }
      .el-button{
        padding: 0;
      }
      }
    }

    // 基本信息和企业信息的每一个信息项样式
    .message{
      padding: 0px 20px 8px 20px;

      display: flex;
      flex-wrap: wrap;
      border-top: 1px solid #F2F6FC;
      >div{
        flex: 30%;
        max-width: 30%;
        padding: 8px;
        color: #606266;
        align-items: center;
        font-size: 12px;
        height: 40px;
        display: flex;
        align-items: center;
        >span{
          color: #303133;
          font-size: 14px;
          >i{
            margin-right: 8px;
          }
        }
      }
    }
  }
  }
.measureForm{
  //
  .el-form-item{
    //
    .el-date-editor{
      width: 100%;
    }
  }
}
</style>