Merge remote-tracking branch 'origin/master'

gaoluyang

2024-07-31 38e6f27a8082e1173e3c02a33da5da39b6c6872c

 src/components/do/b6-device-management/b6-data-acquisition-config.vue

@@ -4,6 +4,7 @@
      <el-row class="title">
        <el-col :span="6" style="padding-left: 20px;text-align: left;">数采配置</el-col>
        <el-col :span="18" style="text-align: right;">
          <el-button size="medium" type="primary" @click="fileConfiguration">文件配置</el-button>
          <el-button size="medium" @click="$parent.closeDataVue()">
            <span style="color: #3A7BFA;">返回</span>
          </el-button>
@@ -12,10 +13,21 @@
    </div>
    <div class="table">
      <el-table :data="tableList.slice((page.current - 1) * page.size, page.current * page.size)"
                border tooltip-effect="dark" style="width: 100%;" height="100%">
                border tooltip-effect="dark" style="width: 100%;" height="100%" :span-method="spanMethod">
        <el-table-column type="index" label="序号" align="center" width="65"></el-table-column>
        <el-table-column prop="insProductItem" align="center" label="检验项目">
        </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="inspectionItem" align="center" label="检验项" min-width="100"></el-table-column>
        <el-table-column prop="inspectionItemSubclass" align="center" label="检验项子项" min-width="100"></el-table-column>
        <el-table-column prop="referx" align="center" label="参照X" min-width="100"></el-table-column>
        <el-table-column prop="x" align="center" label="X"></el-table-column>
        <el-table-column prop="refery" align="center" label="参照Y" min-width="100"></el-table-column>
        <el-table-column prop="y" align="center" label="Y"></el-table-column>
        <el-table-column prop="formula" align="center" label="公式"></el-table-column>
        <el-table-column prop="section" label="操作" width="120">
          <template slot-scope="scope">
            <el-button type="text" @click="dataConfig(scope.row)">数采配置</el-button>
@@ -70,9 +82,30 @@
            <el-button @click="addDomain" size="small" type="primary" style="position: absolute; bottom: -65px;left: 62px" v-if="index === domains.length-1">新增域名</el-button>
          </el-form-item>
        </div>
        <div class="fomItem1">
          <el-form-item class="fomItemInput" label="公式:">
            <el-input v-model="configForm.formula" @change="evalResult"></el-input>
        <div class="fomItem2">
          <el-form-item class="fomItemInput1">
            <template v-slot="label">
              公式：
              <el-tooltip class="itemFomItem" effect="dark" content="求参数最大值，参数个数最少两个，如：MAX(1,2)" placement="top">
                <label>MAX()</label>
              </el-tooltip>
              <el-tooltip class="itemFomItem" effect="dark" content="求参数最小值，参数个数最少两个，如：MIN(1,2)" placement="top">
                <label>MIN()</label>
              </el-tooltip>
              <el-tooltip class="itemFomItem" effect="dark" content="求和，参数个数最少两个，如：SUM(1,2)" placement="top">
                <label>SUM()</label>
              </el-tooltip>
              <el-tooltip class="itemFomItem" effect="dark" content="求绝对值，参数个数最少一个，如：ABS(1)" placement="top">
                <label>ABS()</label>
              </el-tooltip>
              <el-tooltip class="itemFomItem" effect="dark" content="求平均值，参数个数最少两个个，如：AVERAGE(1,2)" placement="top">
                <label>AVERAGE()</label>
              </el-tooltip>
              <el-tooltip class="itemFomItem" effect="dark" content="求中值，参数个数最少两个个，如：MEDIAN(1,2)" placement="top">
                <label>MEDIAN()</label>
              </el-tooltip>
              <el-input type="textarea" autosi:autosize="{ minRows: 2, maxRows: 4}"ze placeholder="请输入内容" v-model="configForm.formula" @change="evalResult"> </el-input>
            </template>
          </el-form-item>
        </div>
      </el-form>
@@ -83,29 +116,74 @@
            </el-row>
         </span>
    </el-dialog>
    <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：</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">储存地址：</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-select v-model="configForm.fileType" size="small" placeholder="请选择" style="width: 100%;">
          <el-option
            v-for="item in fileTypeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
         </div>
      <div v-if="configForm.fileType == '.mdb'" class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label">委托字段：</div>
            <el-input size="small" placeholder="请输入" clearable
                  v-model="configForm.mdbEntrustCode"></el-input>
         </div>
      <div v-if="configForm.fileType == '.mdb'" class="search_thing" style="margin-bottom: 14px;">
            <div class="search_label">样品字段：</div>
            <el-input size="small" placeholder="请输入" clearable
                  v-model="configForm.mdbSampleCode"></el-input>
         </div>
      <span slot="footer" class="dialog-footer">
            <el-row>
               <el-button @click="dialogVisible4=false">取 消</el-button>
               <el-button type="primary" @click="submitForm4" :loading="upLoad4">确 定</el-button>
            </el-row>
         </span>
    </el-dialog>
  </div>
</template>

<script>

export default {
  name: "dataAcquisitionConfig",
  // import 引入的组件需要注入到对象中才能使用
  components: {},
  components: {
  },
  props: {
    tableList: {
      type: Array,
    deviceId: {
      type: Number,
      default: () => []
    }
  },
  mounted() {
    this.tableList.forEach(i => {
      let data = i.insProductItem.split(',')
      i.insProductItem = data[data.length - 1]
    })
    this.init()
  },
  data() {
    // 这里存放数据
    return {
      dialogVisible4: false,
      tableList: [],
      page: {
        current: 1,
        size: 20,
@@ -123,6 +201,7 @@
        }
      ],
      upLoad3:false,
      upLoad4:false,
      fileTypeOptions: [
        {label: 'csv', value: '.csv'},
        {label: 'db', value: '.db'},
@@ -131,18 +210,206 @@
        {label: 'excel', value: '.xlsx'},
        {label: 'txt', value: '.txt'},
        {label: 'png', value: '.png'},
      ]
      ],
      spanList: [],
      specialSpanList: [],
      spanConfig: {
            special: {
              main: "inspectionItemSubclass",
              rows:[
              {
                name:'deviceName',
                index:1
              },
              {
                name:'fileType',
                index:2
              },
              {
                name:'collectUrl',
                index:3
              },
              {
                name:'storageUrl',
                index:4
              },
              {
                name:'ip',
                index:5
              },
              {
                name:'inspectionItem',
                index:6
              },
              {
                name:'inspectionItemSubclass',
                index:7
              },
              {
                name:'formula',
                index:13
              },
              {
                name:'inspectionItemSubclass',
                index:14
              }
            ]
            }
      },
      deleteList: []
    }
  },
  // 方法集合
  methods: {
    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)
        }
    },
    init() {
      // this.tableList = []
      this.$axios.get(this.$api.deviceScope.queryDataAcquisitionConfiguration + "?deviceId=" + this.deviceId + "&isDevice=" + false).then(res => {
        this.tableList = res.data
        this.tableList.forEach(i => {
          // replace(/=/g, ' ')
          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, 'mdbEntrustCode', this.tableList[0].mdbEntrustCode)
          this.$set(this.configForm, 'mdbSampleCode', this.tableList[0].mdbSampleCode)
        }
        // 一般的合并行
        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);
            })
          }
      })
    },
    submitForm4() {
      const obj = Object.assign({
        deviceId: this.deviceId,
        fileType: this.configForm.fileType,
        collectUrl: this.configForm.collectUrl,
        storageUrl: this.configForm.storageUrl,
        ip: this.configForm.ip,
        isDevice: true,
        mdbEntrustCode: this.configForm.mdbEntrustCode,
        mdbSampleCode: this.configForm.mdbSampleCode
      })
      this.upLoad4 = true
      this.$axios.post(this.$api.deviceScope.saveDataAcquisitionConfiguration + "?deviceId=" + this.deviceId, obj, {headers: {
            'Content-Type': 'application/json'
          }}).then(res => {
            if(res.code == 200) {
              this.tableList = res.data
              this.dialogVisible4 = false
              this.init()
              this.$message.success('操作成功')
            }
            this.upLoad4 = false
      }).catch(err => {
        this.upLoad4 = false
      })
    },
    dataConfig (row) {
      this.configForm = {
        deviceId: row.deviceId,
        insProductItem: row.insProductItem.trim()
        inspectionItem: row.inspectionItem.trim(),
        inspectionItemSubclass: row.inspectionItemSubclass,
        structureItemParameterId: row.structureItemParameterId
      }
      this.dialogVisible3 = true
      this.$axios.get(this.$api.deviceScope.queryDataAcquisitionConfiguration + "?deviceId=" + row.deviceId + "&insProductItem=" + row.insProductItem.trim()).then(res => {
      this.$axios.get(this.$api.deviceScope.queryDataAcquisitionConfiguration + "?deviceId=" + this.deviceId +
      "&inspectionItem=" + row.inspectionItem.trim() +
      "&isDevice=" + true +
      "&inspectionItemSubclass=" + row.inspectionItemSubclass.trim()).then(res => {
        const data = res.data
        if(data[0]) {
          this.domains.splice(0, 1)
@@ -176,10 +443,12 @@
              i.y = null
            }
            i.formula = this.configForm.formula
            i.deviceId = this.configForm.deviceId
            i.insProductItem = this.configForm.insProductItem
            i.deviceId = this.deviceId
            i.inspectionItem = this.configForm.inspectionItem
            i.inspectionItemSubclass = this.configForm.inspectionItemSubclass
            i.structureItemParameterId = this.configForm.structureItemParameterId
          })
          this.$axios.post(this.$api.deviceScope.saveDataAcquisitionConfiguration, {dataConfigList: this.domains},{headers: {
          this.$axios.post(this.$api.deviceScope.saveDataAcquisitionConfiguration + "?deviceId=" + this.deviceId, {dataConfigList: this.domains, isDevice: false},{headers: {
            'Content-Type': 'application/json'
          }}).then(res => {
            this.dialogVisible3 = false
@@ -192,6 +461,14 @@
                id: ''
              }
            ]
            if(this.deleteList.length > 0) {
              this.$axios.delete(this.$api.deviceScope.deleteDataAcquisitionConfiguration + "?ids=" + this.deleteList.join()).then(res => {
                if(res.code == 200) {
                  this.init()
                }
              })
            }
            this.init()
            this.$message.success('添加成功')
          })
        } else {
@@ -203,11 +480,12 @@
      // 删除公式formItem
      const index = this.domains.indexOf(item)
      if (index !== -1 && this.domains.length > 1) {
        this.$axios.get(this.$api.deviceScope.deleteDataAcquisitionConfiguration + "?id=" + item.id).then(res => {
          if(res.code == 200) {
            this.domains.splice(index, 1)
          }
        })
        if(item.id){
          this.deleteList.push(item.id)
          this.domains.splice(index, 1)
        } else {
          this.domains.splice(index, 1)
        }
      } else {
        this.$message.error('不允许删除最后一条数据！');
      }
@@ -222,7 +500,8 @@
        id: ''
      });
    },
    evalResult () {
    evalResult (val) {
      this.configForm.formula = val
      // 根据公式计算出结果
    },
    sizeChange(val) {
@@ -232,6 +511,7 @@
      this.page.current = val
    },
    closeForm () {
      this.deleteList = []
      this.domains = [{
        referx: '',
        refery: '',
@@ -247,6 +527,21 @@
</script>

<style scoped>
.itemFomItem {
  margin-left: 20px;
}

.search_thing {
      width: 350px;
      display: flex;
      align-items: center;
   }
  .search_label {
      width: 110px;

      font-size: 14px;
      text-align: right;
   }
.data-acquisition-config {
  width: 100%;
  height: 100%;
@@ -273,10 +568,18 @@
  display: flex;
  height: 74px;
}
.fomItem2 {
  display: flex;
  width: 100%;
}
.fomItemInput {
  width: 180px;
  margin-right: 6px;
}
.fomItemInput1 {
  width: 100%;
  margin-right: 6px;
}
>>>.el-form-item__label {
  padding-bottom: 0 !important;
}