完成标准物质清单迁移

licp

2024-12-20 85f0da92ca6882169495550f5d8fa36e92088c8d

 src/components/view/a6-standard-material-list.vue

@@ -1,139 +1,331 @@
<style scoped>
  .title {
    height: 60px;
    line-height: 60px;
  }

  .search {
    background-color: #fff;
    height: 80px;
    display: flex;
    align-items: center;
  }
  .search_thing {
    display: flex;
    align-items: center;
    height: 50px;
  }
  .search_label {
    width: 120px;
    font-size: 14px;
    text-align: right;
  }

  .search_input {
    width: calc(100% - 120px);
  }
  .table {
    margin-top: 10px;
    background-color: #fff;
    width: calc(100% - 40px);
    height: calc(100% - 60px - 80px - 10px - 40px);
    padding: 20px;
  }

</style>
<template>
  <div class="below-standard-main">
    <div style="width: 100%;height: 100%;">
      <div>
        <el-row class="title">
          <el-col :span="12" style="padding-left: 20px;text-align: left;">标准物质清单</el-col>
          <el-col :span="12" style="text-align: right;">
                  <el-button size="medium" type="primary" @click="$refs['ValueTable'].openAddDia('新增接口')" v-if="addPower">新 增</el-button>
            <el-button size="medium" @click="$refs['ValueTable'].openDownDia()">导 出</el-button>
               </el-col>
        </el-row>
  <div>
    <div>
      <div class="view-title">
        <span>标准物质清单</span>
        <span>
          <el-button size="medium" @click="exportFun">导 出</el-button>
          <el-button size="medium" type="primary" @click="openFormDia('add')">新 增</el-button>
        </span>
      </div>
      <div class="search">
        <div class="search_thing">
          <div class="search_label">名称：</div>
          <div class="search_input">
              <el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.model"
                        @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.sample"
              @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>
        </div>
      <div class="search-background">
        <span class="search-group">
          <span style="width: 180px">标准物质名称：</span>
          <el-input v-model="searchForm.name" clearable size="small"></el-input>
        </span>
        <span class="search-group">
          <span style="width: 120px">生产厂家：</span>
          <el-input v-model="searchForm.factoryManufacturer" clearable size="small"></el-input>
        </span>
        <span class="search-group">
          <el-button size="medium"  @click="resetSearchForm">重 置</el-button>
          <el-button size="medium" type="primary" @click="searchList">查 询</el-button>
        </span>
      </div>
      <div class="table">
          <ValueTable ref="ValueTable" :url="$api.unPass.pageInsUnPass" :componentData="componentData"
          :key="upIndex" />
        <div>
          <TableCard :showForm="false" :showTitle="false">
            <template v-slot:table>
              <ZTTable
                :column="tableColumn"
                :height="'calc(100vh - 23em)'"
                :table-data="tableData"
                :table-loading="tableLoading"
                style="padding: 0 15px;margin-bottom: 16px">
              </ZTTable>
            </template>
          </TableCard>
          <el-pagination :current-page="1" :page-size="page.size" :page-sizes="[10, 20, 30, 50, 100]"
                         :total="total" layout="->,total, sizes, prev, pager, next, jumper"
                         @size-change="handleSizeChange"
                         @current-change="handleCurrentChange">
          </el-pagination>
        </div>
      </div>
    </div>
    <form-dia v-if="formDia" ref="formDia" @closeYearDia="closeYearDia"></form-dia>
    <borrow-dia v-if="borrowDia" ref="borrowDia" @closeYearDia="closeBorrowDia"></borrow-dia>
    <return-dia v-if="returnDia" ref="returnDia" @closeYearDia="closeReturnDia"></return-dia>
  </div>
</template>

<script>
  import ValueTable from '../tool/value-table.vue'
  import ZTTable from '../caorui/ZTTable/index.vue';
  import TableCard from '../caorui/TableCard/index.vue';
  import FormDia from '../do/a6-standard-material-list/formDia.vue';
  import BorrowDia from '../do/a6-standard-material-list/borrowDia.vue';
  import ReturnDia from '../do/a6-standard-material-list/returnDia.vue';
export default {
  components: {
    ReturnDia,
    BorrowDia,
    FormDia,
    TableCard,
    ZTTable,
    ValueTable,
  },
  data() {
    return {
        componentData: {
          entity: {
            sample: null,
            model: null,
            orderBy: {
              field: 'id',
              order: 'asc'
            }
          },
          isIndex: true,
          showSelect: false,
          select: false,
          do: [
            {
              id: 'update',
              font: '编辑',
              type: 'text',
              method: 'doDiy',
              field:['createUserName','updateUserName']
            },{
              id: 'delete',
              font: '删除',
              type: 'text',
              method: 'doDiy'
            }
          ],
          tagField: [],
          selectField: [],
          requiredAdd: ['model','sample',],
          requiredUp: [],
          needSort: ['sample'],
      searchForm: {
        name: '',
        factoryManufacturer: '',
      },
      tableColumn: [
        {
          label: '标准物质名称',
          prop: 'name',
          minWidth: '120'
        },
        entityCopy: {},
        upIndex: 0,
        stateList: [],
        addPower:true,
      }
        {
          label: '规格型号',
          prop: 'model',
          minWidth: '100'
        },
        {
          label: '生产厂家',
          prop: 'factoryManufacturer',
          minWidth: '100'
        },
        {
          label: '出厂编号',
          prop: 'factoryNum',
          minWidth: '100'
        },
        {
          label: '管理编号',
          prop: 'manageNum',
          minWidth: '100'
        },
        {
          label: '不确定度',
          prop: 'uncertainty',
          minWidth: '100'
        },
        {
          label: '数量',
          prop: 'quantity',
          minWidth: '100'
        },
        {
          label: '购置日期',
          prop: 'acquisitionDate',
          minWidth: '150'
        },
        {
          label: '有效期',
          prop: 'effectiveDate',
          minWidth: '150'
        },
        {
          label: '档案编号',
          prop: 'fileNum',
          minWidth: '100'
        },
        {
          label: '存放位置',
          prop: 'position',
          minWidth: '100'
        },
        {
          label: '备注',
          prop: 'remark',
          minWidth: '100'
        },
        // {
        //   label: '创建人',
        //   prop: 'createUser',
        //   minWidth: '100'
        // },
        {
          label: '创建时间',
          prop: 'createTime',
          minWidth: '150'
        },
        {
          dataType: 'action',
          fixed: 'right',
          minWidth: '180',
          label: '操作',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openFormDia('edit', row);
              },
            },
            {
              name: '借用',
              type: 'text',
              clickFun: (row) => {
                this.borrow(row);
              },
            },
            {
              name: '归还',
              type: 'text',
              clickFun: (row) => {
                this.return(row);
              }
            },
            {
              name: '删除',
              type: 'text',
              color: '#f56c6c',
              clickFun: (row) => {
                this.delPlan(row)
              },
            }
          ]
        }
      ],
      tableData: [],
      tableLoading: false,
      page: {
        size: 20,
        current: 1,
      },
      total: 0,
      formDia: false,
      borrowDia: false,
      returnDia: false,
    }
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity)
    this.getPower()
    this.searchList()
  },
  methods :{
    refreshTable() {
        this.$refs['ValueTable'].selectList()
      },
    refresh() {
        this.componentData.entity = this.HaveJson(this.entityCopy)
        this.upIndex++
      },
    // 权限分配
    getPower(radio) {
      let power = JSON.parse(sessionStorage.getItem('power'))
    exportFun() {
      this.outLoading = true
      this.$axios.get(this.$api.feStandardSubstance.exportOfStandardSubstanceList + '?factoryManufacturer=' + this.searchForm.factoryManufacturer
        + '&name=' + this.searchForm.name, {responseType: "blob"}).then(res => {
        this.outLoading = false
        this.$message.success('导出成功')
        const blob = new Blob([res], {type: 'application/octet-stream'});
        const url = URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        link.download = '标准物质清单.xlsx';
        link.click();
      }).finally(() => {
        this.outLoading = false
      })
    },
    // 查询列表
    searchList () {
      this.tableLoading = true
      this.$axios.get(this.$api.feStandardSubstance.getPageStandardSubstance + '?factoryManufacturer=' + this.searchForm.factoryManufacturer
        + '&name=' + this.searchForm.name
        + '&pages=' + this.page.current + '&size=' + this.page.size).then(res => {
        this.tableLoading = false
        if (res.code === 201) return
        this.tableData = res.data.records
        this.total = res.data.total
      }).catch(err => {
        this.tableLoading = false
      })
    },
    // 删除
    delPlan (row) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.tableLoading = true
        this.$axios.get(this.$api.feStandardSubstance.removeStandardSubstance + '?id=' + row.id).then(res => {
          this.tableLoading = false
          if (res.code === 201) return
          this.$message.success('删除成功')
          this.searchList()
        }).catch(err => {
          this.tableLoading = false
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // 新增，编辑，批准弹框
    openFormDia (type, row) {
      this.formDia = true
      this.$nextTick(() => {
        this.$refs.formDia.openDia(type, row)
      })
    },
    closeYearDia () {
      this.formDia = false
      this.searchList()
    },
    // 借用
    borrow (row) {
      this.borrowDia = true
      this.$nextTick(() => {
        this.$refs.borrowDia.openDia(row)
      })
    },
    closeBorrowDia () {
      this.borrowDia = false
      this.searchList()
    },
    // 归还
    return (row) {
      this.returnDia = true
      this.$nextTick(() => {
        this.$refs.returnDia.openDia(row)
      })
    },
    closeReturnDia () {
      this.returnDia = false
      this.searchList()
    },
    // 重置查询条件
    resetSearchForm () {
      this.searchForm.name = '';
      this.searchForm.factoryManufacturer = '';
      this.searchList()
    },
    // 分页
    handleSizeChange(val) {
      this.page.size = val;
      this.searchList();
    },
    handleCurrentChange(val) {
      this.page.current = val;
      this.searchList();
    },
  }
}
</script>
<style scoped>
.view-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 60px;
  padding-left: 20px;
}

.search-background {
  width: 100%;
  height: 80px;
  line-height: 80px;
  background-color: #ffffff;
  display: flex;
}

.search-group {
  display: flex;
  align-items: center;
  margin: 0 20px;
}

.table {
  margin-top: 20px;
  background-color: #ffffff;
  padding-top: 20px;
}
</style>