设备工具明细-数采配置显示bug

gaoluyang

2025-03-29 6f54db5fe118a17c5eb75c7e67abfd27534e4227

 src/views/CNAS/resourceDemand/device/component/acquisitionConfig.vue

@@ -12,19 +12,11 @@
      </el-row>
    </div>
    <div class="table">
      <el-table :data="tableList.slice(
        (page.current - 1) * page.size,
        page.current * page.size
      )
        " border tooltip-effect="dark" style="width: 74%;" height="100%" :span-method="spanMethod">
      <el-table :data="tableList.slice((page.current - 1) * page.size,page.current * page.size)"
                :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border
                tooltip-effect="dark" height="100%">
        <el-table-column type="index" label="序号" align="center" width="65"></el-table-column>
        <el-table-column prop="deviceName" align="center" min-width="100" label="设备名称"></el-table-column>
        <el-table-column prop="fileType" align="center" label="文件后缀"></el-table-column>
        <el-table-column prop="collectUrl" align="center" min-width="100" show-overflow-tooltip
          label="采集地址"></el-table-column>
        <el-table-column prop="storageUrl" align="center" min-width="100" show-overflow-tooltip
          label="存储地址"></el-table-column>
        <el-table-column prop="ip" align="center" label="IP地址" min-width="100"></el-table-column>
        <el-table-column prop="sample" align="center" label="检验对象" show-overflow-tooltip
          min-width="150"></el-table-column>
        <el-table-column prop="inspectionItemClass" align="center" label="检验项分类" min-width="120"></el-table-column>
@@ -37,7 +29,7 @@
        <el-table-column prop="anotherName" align="center" label="别名" min-width="100"></el-table-column>
        <el-table-column prop="matchingName" align="center" label="匹配名称" min-width="100"></el-table-column>
        <el-table-column prop="formula" align="center" label="公式"></el-table-column>
        <el-table-column prop="section" fixed="right" label="操作" width="120">
        <el-table-column fixed="right" label="操作" width="120" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click="dataConfig(scope.row)">数采配置</el-button>
          </template>
@@ -53,7 +45,8 @@
    <el-dialog title="数采配置" :visible.sync="dialogVisible3" width="920px" :before-close="closeForm">
      <el-form :model="configForm" label-position="top" size="small" ref="configForm" label-width="100px"
        class="demo-ruleForm">
        <el-table :data="domains" style="width: 100%" height="300">
        <el-table :data="domains" style="width: 100%" height="300"
                  :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border>
          <el-table-column label="序号" type="index" width="80">
            <template v-slot="scope">
              {{ getIndexWithAlphabet(scope.$index) }}
@@ -118,7 +111,7 @@
        </el-row>
      </span>
    </el-dialog>
    <el-dialog title="数采配置" :visible.sync="dialogVisible4" width="400px">
    <el-dialog title="文件配置" :visible.sync="dialogVisible4" width="400px">
      <div class="search_thing" style="margin-bottom: 14px;">
        <div class="search_label">
          <span style="color:red;margin-right: 4px;">*</span>IP：
@@ -170,7 +163,7 @@
import {
  queryDataAcquisitionConfiguration,
  saveDataAcquisitionConfiguration,
  deleteDataAcquisitionConfiguration,
  deleteDataAcquisitionConfiguration, getDeviceById, saveDeviceFileConfiguration, queryProductConfiguration,
} from '@/api/cnas/resourceDemand/device.js'
export default {
  name: "dataAcquisitionConfig",
@@ -181,9 +174,6 @@
      type: Number,
      default: () => []
    }
  },
  mounted() {
    this.init();
  },
  data() {
    // 这里存放数据
@@ -299,107 +289,14 @@
      deleteList: []
    };
  },
  mounted() {
    this.init();
  },
  // 方法集合
  methods: {
    getIndexWithAlphabet(index) {
      const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
      const letterIndex = index % 26;
      return alphabet.charAt(letterIndex) + (index + 1);
    },
    rowspan(spanArr, position, spanName) {
      this.tableList.forEach((item, index) => {
        if (index === 0) {
          spanArr.push(1);
          position = 0;
        } else {
          if (
            this.tableList[index][spanName] ===
            this.tableList[index - 1][spanName]
          ) {
            spanArr[position] += 1;
            spanArr.push(0);
          } else {
            spanArr.push(1);
            position = index;
          }
        }
      });
    },
    spanMethod({ row, column, rowIndex, columnIndex }) {
      // 一般的合并行
      if (
        this.spanConfig != undefined &&
        this.spanConfig.rows &&
        this.spanConfig.rows.length > 0
      ) {
        let i = null;
        let obj = this.spanConfig.rows.find((item, index) => {
          i = index;
          return item.index == columnIndex;
        });
        if (obj) {
          const _row = this.spanList[i].arr[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          };
        }
      }
      // 特殊的合并行
      if (
        this.spanConfig != undefined &&
        this.spanConfig.special &&
        this.spanConfig.special.main &&
        this.spanConfig.special.rows &&
        this.spanConfig.special.rows.length > 0
      ) {
        let i = null;
        let obj = this.spanConfig.special.rows.find((item, index) => {
          i = index;
          return item.index == columnIndex;
        });
        if (obj) {
          const _row = this.specialSpanList[i].arr[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          };
        }
      }
    },
    fileConfiguration() {
      this.dialogVisible4 = true;
      if (this.tableList[0]) {
        this.$set(this.configForm, "fileType", this.tableList[0].fileType);
        this.$set(this.configForm, "collectUrl", this.tableList[0].collectUrl);
        this.$set(this.configForm, "storageUrl", this.tableList[0].storageUrl);
        this.$set(this.configForm, "ip", this.tableList[0].ip);
        this.$set(
          this.configForm,
          "entrustCode",
          this.tableList[0].entrustCode
        );
        this.$set(
          this.configForm,
          "sampleCode",
          this.tableList[0].sampleCode
        );
        this.$set(
          this.configForm,
          "dbFileName",
          this.tableList[0].dbFileName
        );
        this.$set(
          this.configForm,
          "fiberOpticRibbon",
          this.tableList[0].fiberOpticRibbon
        )
      }
    },
    // 查询列表
    init() {
      queryDataAcquisitionConfiguration({ deviceId: this.deviceId, isDevice: false }).then(res => {
      queryDataAcquisitionConfiguration({ deviceId: this.deviceId }).then(res => {
        this.tableList = res.data;
        this.tableList.forEach(i => {
          let isIncludes = false
@@ -413,88 +310,33 @@
          if (!isIncludes && i.formula) {
            i.formula = i.formula.slice(1, -1)
          }
          i.sample = i.sample
            .replace(/"/g, "")
            .replace(/],/g, "；")
            .replace(/\[/g, "")
            .replace(/]/g, "");
        });
        if (this.tableList[0]) {
          this.$set(this.configForm, "fileType", this.tableList[0].fileType);
          this.$set(
            this.configForm,
            "collectUrl",
            this.tableList[0].collectUrl
          );
          this.$set(
            this.configForm,
            "storageUrl",
            this.tableList[0].storageUrl
          );
          this.$set(this.configForm, "ip", this.tableList[0].ip);
          this.$set(
            this.configForm,
            "entrustCode",
            this.tableList[0].entrustCode
          );
          this.$set(
            this.configForm,
            "sampleCode",
            this.tableList[0].sampleCode
          );
          this.$set(
            this.configForm,
            "dbFileName",
            this.tableList[0].dbFileName
          );
          this.$set(
            this.configForm,
            "fiberOpticRibbon",
            this.tableList[0].fiberOpticRibbon
          )
        }
        // 一般的合并行
        if (
          this.spanConfig != undefined &&
          this.spanConfig.rows &&
          this.spanConfig.rows.length > 0
        ) {
          this.spanList = [];
          this.spanConfig.rows.forEach((item, index) => {
            this.spanList.push({
              arr: [],
              position: 0
            });
            this.rowspan(
              this.spanList[index].arr,
              this.spanList[index].position,
              item.name
            );
          });
        }
        // 特殊的合并行
        if (
          this.spanConfig != undefined &&
          this.spanConfig.special &&
          this.spanConfig.special.main &&
          this.spanConfig.special.rows &&
          this.spanConfig.special.rows.length > 0
        ) {
          this.specialSpanList = [];
          this.spanConfig.special.rows.forEach((item, index) => {
            this.specialSpanList.push({
              arr: [],
              position: 0
            });
            this.rowspan(
              this.specialSpanList[index].arr,
              this.specialSpanList[index].position,
              this.spanConfig.special.main
            );
          });
        }

      });
    },
    getIndexWithAlphabet(index) {
      const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
      const letterIndex = index % 26;
      return alphabet.charAt(letterIndex) + (index + 1);
    },
    fileConfiguration() {
      this.dialogVisible4 = true;
      this.getInfo()
    },
    // 查询文件配置信息
    getInfo() {
      getDeviceById({deviceId: this.deviceId}).then(res => {
        this.$set(this.configForm, "fileType", res.data.fileType);
        this.$set(this.configForm, "collectUrl", res.data.collectUrl);
        this.$set(this.configForm, "storageUrl", res.data.storageUrl);
        this.$set(this.configForm, "ip", res.data.ip);
        this.$set(this.configForm, "entrustCode", res.data.entrustCode);
        this.$set(this.configForm, "sampleCode", res.data.sampleCode);
        this.$set(this.configForm, "dbFileName", res.data.dbFileName);
        this.$set(this.configForm, "fiberOpticRibbon", res.data.fiberOpticRibbon)
      })
    },
    // 提交文件配置
    submitForm4() {
      const obj = Object.assign({
        deviceId: this.deviceId,
@@ -502,16 +344,14 @@
        collectUrl: this.configForm.collectUrl,
        storageUrl: this.configForm.storageUrl,
        ip: this.configForm.ip,
        isDevice: true,
        entrustCode: this.configForm.entrustCode,
        sampleCode: this.configForm.sampleCode,
        dbFileName: this.configForm.dbFileName,
        fiberOpticRibbon: this.configForm.fiberOpticRibbon
      });
      this.upLoad4 = true;
      saveDataAcquisitionConfiguration({ deviceId: this.deviceId, ...obj }).then(res => {
      saveDeviceFileConfiguration({ deviceId: this.deviceId, ...obj }).then(res => {
        if (res.code == 200) {
          // this.tableList = res.data;
          this.dialogVisible4 = false;
          this.init();
          this.$message.success("操作成功");
@@ -522,6 +362,7 @@
          this.upLoad4 = false;
        });
    },
    // 打开数采配置弹框
    dataConfig(row) {
      this.configForm = {
        deviceId: row.deviceId,
@@ -531,7 +372,7 @@
        inspectionItemClass: row.inspectionItemClass,
      };
      this.dialogVisible3 = true;
      queryDataAcquisitionConfiguration({
      queryProductConfiguration({
        deviceId: this.deviceId,
        inspectionItem: row.inspectionItem.trim(),
        isDevice: true,
@@ -571,6 +412,7 @@
        }
      });
    },
    // 提交数采配置
    submitForm3() {
      this.$refs.configForm.validate(valid => {
        // 表单校验
@@ -722,9 +564,7 @@
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100vw - 1em);
  height: calc(100vh - 18em);
}