优化

licp

2024-05-14 2caf6c0b519300a24788b7cd8d57fb0c1f0b1a0e

 src/components/view/b2-standard.vue

@@ -6,7 +6,7 @@

  .left {
    width: 270px;
    height: calc(100% - 40px - 30px);
    height: calc(100% - 40px - 10px);
    background-color: white;
    padding: 15px;
  }
@@ -38,8 +38,8 @@
  }

  .right .title {
    height: 50px;
    line-height: 50px;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    background-color: white;
  }
@@ -51,7 +51,7 @@

  .product_table {
    border-top: 1px solid #ebeef5;
    height: calc(100% - 275px);
    height: calc(100% - 235px);
    margin-top: 5px;
    background-color: white;
    user-select: none;
@@ -67,6 +67,17 @@
  }
  >>>.el-table__body-wrapper{
    height: calc(100% - 46px) !important;
  }
  >>>.header-class{
    height: 40px !important;
  }
  >>>.header-class th.el-table__cell>.cell{
    line-height: 14px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  >>>.el-table__row{
    height: 30px !important;
  }
</style>
<style>
@@ -146,7 +157,7 @@
      </el-row>
      <el-row class="standard_table" v-loading="tableLoad">
        <el-table class="el-table" :data="standardList" style="width: 100%;height: 220px !important;" height="220" tooltip-effect="dark"
          highlight-current-row @row-click="rowClick" ref="standard">
          highlight-current-row @row-click="rowClick" ref="standard" header-row-class-name="header-class">
          <el-table-column prop="code" label="标准编号" show-overflow-tooltip width="200">
            <template slot-scope="scope">
              <span style="color: red;font-size: 14px;">{{scope.row['code']}}</span>
@@ -167,7 +178,11 @@
        <el-table :data="pagedData" ref="productTable" style="width: 100%;" height="100%" tooltip-effect="dark" stripe
          :fit="true" border
          @selection-change="handleSelectionChange" :row-class-name="tableRowClassName"
          @select="upProductSelect" @select-all="handleAll">
          @select="upProductSelect"
          @select-all="handleAll"
          class="productTable"
          @filter-change="filterChange"
          header-row-class-name="header-class">
          <el-table-column type="selection" width="65">
          </el-table-column>
          <el-table-column prop="model" label="型号" min-width="120" show-overflow-tooltip></el-table-column>
@@ -444,12 +459,14 @@
        total:0,
        pageSize:100,
        currentPage:1,
        productLists:[],
      }
    },
    computed: {
      pagedData() {
        const start = (this.currentPage - 1) * this.pageSize;
        const end = start + this.pageSize;
        this.total = this.productList.length;
        return this.productList.slice(start, end);
      },
    },
@@ -945,8 +962,8 @@
          id: row.id,
          tree: this.selectTree
        }).then(res => {
          this.productLists = this.HaveJson(res.data)
          this.productList = res.data
          this.total = this.productList.length;
          // setTimeout(() => {
          //   this.productList.forEach(a => {
          //     if (a.state == 1) this.toggleSelection(a)
@@ -983,9 +1000,16 @@
          }
          // this.$message.success('已保存')
        })
        this.productLists.map(item => {
          if(row.id == item.id){
              item.state = row.state;
            }
          return item
        })
      },
      filterHandler(value, row, column) {
        const property = column['property'];
        // console.log(222222222222,row[property],value)
        return row[property] === value;
      },
      handleAll(e) {
@@ -1077,6 +1101,21 @@
      handleCurrentChange(val) {
        this.currentPage = val;
      },
      filterChange(e){
        let arr =[];
        for (let key in e){
          arr = e[key]
        }
        if(arr.length>0){
          let arr0 = this.HaveJson(this.productLists).filter(item=>{
            return arr.find(value=>item.sonLaboratory==value)!==undefined
          })
          this.productList = this.HaveJson(arr0)
        }else{
          this.productList = this.HaveJson(this.productLists)
        }
        // productLists
      }
    }
  }
</script>