边带子设备详情

2024-04-02 17:53:13 +08:00 · 2024-04-02 17:53:13 +08:00 · 7fa787e42d
parent 8581972212
commit 7fa787e42d
3 changed files with 338 additions and 4 deletions
--- a/ah-jjzhgd-web/src/api/device/sidebandDetail.js
+++ b/ah-jjzhgd-web/src/api/device/sidebandDetail.js
@ -0,0 +1,47 @@
+import request from '@/utils/request'
+
+// 查询边带子设备详情列表
+export function getSidebandDetailList(data) {
+  return request({
+    url: '/background/back/deviceBd/getDeviceBdChildDetailList',
+    method: 'get',
+    params: data
+  })
+}
+
+// 新增边带子设备详情
+export function addSidebandDetailItem(data) {
+  return request({
+    url: '/background/back/deviceBd/addDeviceBdChildDetail',
+    method: 'post',
+    data
+  })
+}
+
+// 编辑边带子设备详情
+export function updateSidebandDetailItem(data) {
+  return request({
+    url: '/background/back/deviceBd/updateDeviceBdChildDetail',
+    method: 'post',
+    data
+  })
+}
+
+// 删除边带子设备详情
+export function deleteSidebandDetailItem(data) {
+  return request({
+    url: '/background/back/deviceBd/delDeviceBdChildDetail',
+    method: 'post',
+    data
+  })
+}
+
+// 查看边带子设备详情的详情
+export function getSidebandDetailDetail(data) {
+  return request({
+    url: '/background/back/deviceBd/getDeviceBdChildDetailById',
+    method: 'get',
+    params: data
+  })
+}
+
--- a/ah-jjzhgd-web/src/views/device/sidebandDevice/components/SidebandDetailTable.vue
+++ b/ah-jjzhgd-web/src/views/device/sidebandDevice/components/SidebandDetailTable.vue
@ -0,0 +1,278 @@
+<template>
+  <el-dialog title="边带子设备详情" :visible.sync="visible" width="80%" append-to-body custom-class="custom-modal" @closed="handleClosed">
+    <div class="app-container">
+      <div class="filter-container">
+        <el-input
+          v-model="listQuery.keyWord"
+          placeholder="关键字"
+          style="width: 200px"
+          class="filter-item"
+          :maxlength="30"
+          @keyup.enter.native="handleFilter"
+        />
+        <el-button
+          style="margin-left: 40px"
+          class="filter-item"
+          type="primary"
+          @click="handleFilter"
+        >
+          查询
+        </el-button>
+        <el-button class="filter-item" style="margin-left: 10px" type="primary" @click="handleCreate">
+          新增
+        </el-button>
+      </div>
+
+      <el-table
+        :key="tableKey"
+        v-loading="listLoading"
+        :data="list"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%"
+        :max-height="tableHeight"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55"
+        />
+        <el-table-column label="序号" align="center" width="80" type="index">
+          <template scope="scope">
+            <span>{{ (listQuery.pageNum - 1) * 10 + scope.$index + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="检测名称" align="center" prop="modeName" />
+        <el-table-column label="最大阈值" align="center" prop="maxValueData" />
+        <el-table-column label="最小阈值" align="center" prop="minValueData" />
+        <el-table-column label="采集值类型" align="center" prop="dataType" />
+        <el-table-column label="设备级联编码" align="center" prop="deviceCode" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
+          <template slot-scope="{ row, $index }">
+            <el-button type="text" size="mini" @click="handleUpdate(row, $index)">编辑</el-button>
+            <el-button type="text" size="mini" @click="handleDelete(row, $index)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="listQuery.pageNum"
+        :limit.sync="listQuery.pageSize"
+        @pagination="getList"
+      />
+    </div>
+    <el-dialog append-to-body :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="630px" @closed="handleClosedModal">
+      <el-form
+        ref="dataForm"
+        :rules="rules"
+        :model="temp"
+        label-position="right"
+        label-width="120px"
+      >
+        <el-form-item label="检测名称：" prop="modeName">
+          <el-input v-model="temp.modeName" placeholder="检测名称" :maxlength="50" />
+        </el-form-item>
+        <el-form-item label="最大阈值：" prop="maxValueData">
+          <el-input v-model="temp.maxValueData" placeholder="最大阈值" :maxlength="50" />
+        </el-form-item>
+        <el-form-item label="最小阈值：" prop="minValueData">
+          <el-input v-model="temp.minValueData" placeholder="最小阈值" :maxlength="50" />
+        </el-form-item>
+        <el-form-item label="采集值类型：" prop="dataType">
+          <el-input v-model="temp.dataType" placeholder="采集值类型" :maxlength="50" />
+        </el-form-item>
+        <el-form-item label="设备级联编码：" prop="deviceCode">
+          <el-input v-model="temp.deviceCode" placeholder="设备级联编码" :maxlength="50" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false"> 关闭 </el-button>
+        <el-button type="primary" @click="dialogStatus === 'create' ? createData() : updateData()">
+          提交
+        </el-button>
+      </div>
+    </el-dialog>
+  </el-dialog>
+</template>
+
+<script>
+import Pagination from '@/components/Pagination'
+
+import _ from 'lodash/fp'
+
+import {
+  addSidebandDetailItem, deleteSidebandDetailItem,
+  getSidebandDetailDetail,
+  getSidebandDetailList,
+  updateSidebandDetailItem
+} from '@/api/device/sidebandDetail'
+
+const defaultTmp = {
+  modeName: '',
+  maxValueData: '',
+  minValueData: '',
+  dataType: '',
+  deviceCode: ''
+}
+export default {
+  name: 'SidebandDetailTable',
+  components: { Pagination },
+  props: ['currentId', 'componentVisible'],
+  data() {
+    return {
+      tableKey: 0,
+      list: [],
+      typeList: [],
+      multipleSelection: [],
+      total: 0,
+      listLoading: false,
+      listQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        keyword: '',
+        bidCode: '',
+        proType: ''
+      },
+      tableHeight: 650,
+      showReviewer: false,
+      temp: _.cloneDeep(defaultTmp),
+      dialogFormVisible: false,
+      dialogStatus: '',
+      downloadLoading: false,
+      textMap: {
+        update: '编辑',
+        create: '新增'
+      },
+      processModalVisible: false,
+      rules: {
+        gxName: [{ required: true, message: '请选择', trigger: 'change' }],
+        planStartTime: [{ required: true, message: '不能为空', trigger: 'blur' }],
+        planEndTime: [{ required: true, message: '不能为空', trigger: 'blur' }],
+        gxWeight: [{ required: true, message: '不能为空', trigger: 'blur' }]
+      }
+    }
+  },
+  computed: {
+    visible: {
+      get() {
+        return this.componentVisible
+      },
+      set(val) {
+        this.$emit('update:componentVisible', val)
+      }
+    }
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.getList()
+      }
+    }
+  },
+  created() {
+    // this.getList()
+  },
+  methods: {
+    handleSelectionChange(val) {
+      this.multipleSelection = val
+    },
+    getList() {
+      this.listLoading = true
+      this.listQuery.id = this.currentId
+      getSidebandDetailList(this.listQuery).then((response) => {
+        this.list = response.rows
+        this.total = response.total
+      }).finally(() => {
+        this.listLoading = false
+      })
+    },
+    // 查询
+    handleFilter() {
+      this.listQuery.pageNum = 1
+      this.getList()
+    },
+    // 新增
+    handleCreate() {
+      this.dialogStatus = 'create'
+      this.dialogFormVisible = true
+    },
+    createData() {
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          this.temp.deviceId = this.currentId
+          addSidebandDetailItem(this.temp).then((response) => {
+            this.$message({
+              showClose: true,
+              message: response.msg,
+              type: 'success',
+              duration: 2000
+            })
+            this.getList()
+          }).finally(() => {
+            this.dialogFormVisible = false
+          })
+        }
+      })
+    },
+    // 编辑
+    handleUpdate(row) {
+      getSidebandDetailDetail({ id: row.id }).then((res) => {
+        this.temp = Object.assign({}, res.data)
+      })
+      this.dialogStatus = 'update'
+      this.dialogFormVisible = true
+    },
+    updateData() {
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          updateSidebandDetailItem(this.temp).then((response) => {
+            this.$message({
+              showClose: true,
+              message: response.msg,
+              type: 'success',
+              duration: 2000
+            })
+            this.getList()
+          }).finally(() => {
+            this.dialogFormVisible = false
+          })
+        }
+      })
+    },
+    // 删除数据
+    handleDelete(row, index) {
+      this.$confirm(`确定要删除该数据吗？`, {
+        type: 'warning',
+        title: '操作提示',
+        beforeClose: async(action, instance, done) => {
+          if (action === 'confirm') {
+            deleteSidebandDetailItem({ id: row.id }).then((response) => {
+              done()
+              this.$message({
+                showClose: true,
+                message: response.msg,
+                type: 'success',
+                duration: 2000
+              })
+              this.getList()
+            })
+          } else {
+            done()
+          }
+        }
+      })
+    },
+    handleClosedModal() {
+      this.$refs['dataForm'].resetFields()
+      this.temp = _.cloneDeep(defaultTmp)
+    },
+    handleClosed() {
+      this.list = []
+      this.multipleSelection = []
+    }
+  }
+}
+</script>
--- a/ah-jjzhgd-web/src/views/device/sidebandDevice/index.vue
+++ b/ah-jjzhgd-web/src/views/device/sidebandDevice/index.vue
@ -37,7 +37,6 @@
          <span>{{ (listQuery.pageNum - 1) * 10 + scope.$index + 1 }}</span>
        </template>
      </el-table-column>
-      <el-table-column label="设备ID" align="center" prop="deviceId" />
      <el-table-column label="设备编码" align="center" prop="deviceCode" />
      <el-table-column label="设备类型" align="center" prop="deviceType" />
      <el-table-column label="设备状态" align="center" prop="status" />
@ -48,9 +47,10 @@
      <el-table-column label="设备信号" align="center" prop="deviceModel" />
      <el-table-column label="边带设备名称" align="center" prop="bdName" />
      <el-table-column label="区域名称" align="center" prop="areaName" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="220">
        <template slot-scope="{ row, $index }">
          <el-button type="text" size="mini" @click="handleUpdate(row, $index)">编辑</el-button>
+          <el-button type="text" size="mini" @click="handleDetail(row, $index)">详情</el-button>
          <el-button type="text" size="mini" @click="handleDelete(row, $index)">删除</el-button>
        </template>
      </el-table-column>
@ -105,6 +105,9 @@
        </el-button>
      </div>
    </el-dialog>
+
+    <!--    详情模态框-->
+    <SidebandDetailTable :component-visible.sync="detailVisible" :current-id="currentId" />
  </div>
 </template>

@ -122,6 +125,7 @@ import DeviceSelect from '@/views/device/sideband/components/DeviceSelect.vue'
 import DeviceStatusSelect from '@/views/device/sideband/components/DeviceStatusSelect.vue'
 import AreaSelect from '@/views/device/sideband/components/AreaSelect.vue'
 import SidebandSelect from '@/views/device/sideband/components/SidebandSelect.vue'
+import SidebandDetailTable from '@/views/device/sidebandDevice/components/SidebandDetailTable.vue'

 const defaultTmp = {
  deviceId: '',
@ -140,7 +144,7 @@ const defaultTmp = {
  gtId: ''
 }
 export default {
-  components: { SidebandSelect, AreaSelect, DeviceStatusSelect, DeviceSelect, Pagination },
+  components: { SidebandDetailTable, SidebandSelect, AreaSelect, DeviceStatusSelect, DeviceSelect, Pagination },
  data() {
    return {
      bidCode: '',
@ -164,7 +168,8 @@ export default {
      temp: _.cloneDeep(defaultTmp),
      dialogFormVisible: false,
      dialogStatus: '',
-      downloadLoading: false,
+      detailVisible: false,
+      currentId: '',
      textMap: {
        update: '编辑',
        create: '新增'
@ -310,6 +315,10 @@ export default {
          }
        })
      })
+    },
+    handleDetail(row) {
+      this.detailVisible = true
+      this.currentId = row.deviceId
    }
  }
 }