视频诊断阈值绑定提交

src/api/iot/diagnoseThreshold.js

@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+
+
+//列表
+export function list(query) {
+    return request({
+      url: '/iot/diagnoseThreshold/list',
+      method: 'post',
+      data: query
+    })
+}
+
+//阈值下拉框
+export function thresholdTypeList() {
+  return request({
+    url: `/iot/diagnoseThreshold/thresholdTypeList`,
+    method: 'get',
+  })
+}

src/views/iot/diagnoseThreshold/dialog.detail.vue

@@ -0,0 +1,112 @@
+<template>
+  <DialogCom
+    title="上报历史"
+    :visible.sync="isShow"
+    class="g-dialog-select-safe-check"
+    :close-on-click-modal="false"
+    width="55%"
+    top="10vh"
+    append-to-body
+  >
+    <div class="el-dialog-div" style="margin-bottom:20px">
+      <g-search-table
+        ref="st"
+        url="/iot/sensor/data/log"
+        method="post"
+        :search-data="search"
+        :pageable="true"
+        :select="true"
+        :select-default="selectList"
+        :drag="false"
+        @select="onSelect"
+      >
+        <!-- 搜索 -->
+        <template slot="searchs">
+          <el-form-item class="searchTitle" label="上报时间">
+            <DataRangePicker
+              v-model="search.dateRange"
+              key="daterange"
+              type="daterange"
+              :clearable="timeClearable"
+            />
+          </el-form-item>
+        </template>
+
+        <!-- 表格 -->
+        <template slot="columns">
+          <el-table-column label="设备名称" align="center" prop="deviceName" width="300"/>
+          <el-table-column label="上报时间" prop="createTime" width="300"/>
+          <el-table-column label="上报内容" prop="info" width="300"/>
+        </template>
+      </g-search-table>
+    </div>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="onHide">关 闭</el-button>
+    </div>
+  </DialogCom>
+</template>
+<script>
+import GSearchTable from "@/components/table/gx.search.table.vue";
+import DataRangePicker from "@/components/dateTime/daterange.picker.vue";
+
+export default {
+  components: {GSearchTable, DataRangePicker},
+  data() {
+    return {
+      isShow: false,
+      selectList: [],
+      search: null,
+      timeClearable: true,
+    };
+  },
+  computed: {},
+  watch: {
+    orgId(newval) {
+      this.search.orgId = newval;
+    },
+    dateRange(newval) {
+      this.search.dateRange = newval;
+    },
+  },
+  props: {
+    defaultSelect: {
+      type: Array
+    },
+    orgId: {},
+    dateRange: [],
+  },
+  methods: {
+    show(row) {
+      this.search = this.initSearchData(row);
+      this.isShow = true;
+      this.selectList = this.defaultSelect;
+    },
+    onHide() {
+      this.isShow = false;
+    },
+    onSelect(item) {
+      this.selectList = item;
+    },
+    initSearchData(row) {
+      let data = {"deviceStatusId": row.deviceStatusId, "orgId": row.orgId, "dateRange": []};
+      return data;
+    },
+    emptySearch() {
+      return {
+        deviceCode: null,
+        orgId: this.$store.getters.orgId,
+      };
+    },
+
+  },
+  mounted() {
+
+  },
+};
+</script>
+<style lang="scss" scoped>
+.el-dialog-div {
+  overflow: auto;
+}
+</style>

src/views/iot/diagnoseThreshold/index.vue

@@ -0,0 +1,315 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="24" :xs="24">
+        <div class="main-right-box">
+          <div class="main-search-box">
+            <el-form
+              :model="queryParams"
+              ref="queryForm"
+              size="small"
+              :inline="true"
+              v-show="showSearch"
+            >
+              <el-form-item label="组织机构">
+                <org-tree
+                  v-model="queryParams.orgId"
+                  @defaultKey="getDefaultKey"
+                  @defaultOrg="getDefaultOrg"
+                  @checkChange="checkChange"
+                  @click="clickTreeNode"
+                  ref="orgTree"
+                ></org-tree>
+              </el-form-item>
+              <el-form-item label="设备名称" prop="deviceName">
+                <el-input
+                  v-model="queryParams.deviceName"
+                  clearable
+                  placeholder="请输入关键字"
+                  @keyup.enter.native="handleQuery"/>
+              </el-form-item>
+              <el-form-item label="绑定阈值" prop="state">
+                <el-select
+                  v-model="queryParams.state" clearable
+                  label="绑定阈值" placeholder="请选择绑定状态" prop="state">
+                  <el-option
+                    v-for="item in bindTypes"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"/>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="阈值名称" prop="thresholdCode">
+                <el-select
+                  v-model="queryParams.thresholdCode"
+                  clearable
+                  label="设备类型"
+                  placeholder="请选择告警类型"
+                  prop="thresholdCode"
+                >
+                  <el-option
+                    v-for="item in deviceTypes"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-form>
+
+            <el-row :gutter="10">
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  icon="el-icon-search"
+                  size="mini"
+                  @click="handleQuery"
+                  >搜索
+                </el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  icon="el-icon-refresh"
+                  size="mini"
+                  @click="resetQuery"
+                  >重置
+                </el-button>
+              </el-col>
+
+
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  icon="el-icon-download"
+                  size="mini"
+                  @click="handleExport"
+                >导出数据
+                </el-button>
+              </el-col>
+
+              <right-toolbar
+                :showSearch.sync="showSearch"
+                @queryTable="getList"
+              ></right-toolbar>
+            </el-row>
+          </div>
+
+          <el-table
+            v-loading="loading"
+            :data="dataList"
+            border
+            height="600"
+            size="small"
+          >
+          <el-table-column label="序号" type="index" align="center" width="70">
+          <template slot-scope="scope">
+            {{
+              (queryParams.pageNum - 1) * queryParams.pageSize +
+              scope.$index +
+              1
+            }}
+          </template>
+        </el-table-column>
+            <el-table-column label="地区" align="center" prop="firstOrgName" width="180"/>
+            <el-table-column label="行社名称" align="center" prop="secondOrgName" width="220"/>
+            <el-table-column label="所属机构" align="center" prop="orgName" width="220"/>
+            <el-table-column label="设备名称" align="center" prop="deviceName" width="300"/>
+            <el-table-column label="所属主机" align="center" prop="hostName" width="280"/>
+            <el-table-column label="阈值" align="center" prop="thresholdName" width="380"/>
+          </el-table>
+          <DetailDialog ref="detailDialog" @success="refresh(true)"></DetailDialog>
+          <pagination
+            v-show="total > 0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { list,thresholdTypeList} from "@/api/iot/diagnoseThreshold";
+import  DetailDialog  from "./dialog.detail.vue";
+import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
+import DataRangePicker from "@/components/dateTime/daterange.picker.vue";
+import { mapGetters } from "vuex";
+import dayjs from "dayjs";
+export default {
+  components: { OrgTree, DataRangePicker,DetailDialog },
+  name: "Task",
+  dicts: ["sys_org_type",'sensor_alarm_status','sensor_device_type'],
+  data() {
+    return {
+      bindTypes:[
+            {
+              value: '0',
+              label: '未绑定'
+            },
+            {
+              value: '1',
+              label: '已绑定'
+            }
+      ],
+      deviceTypes: [],
+      // 遮罩层
+      loading: false,
+      // 选中数组
+      ids: [],
+      // 非单个停用
+      single: true,
+      // 非多个停用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 1,
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        checkSub: true,
+        thresholdCode: null,
+        state: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {},
+      timeClearable: true,
+      showOverflowTooltip:true,
+      dataList:[],
+    };
+  },
+  created() {
+    this.queryParams.orgId = this.$store.getters.orgId;
+    this.initDeviceTypeList();
+  },
+  computed: {
+    ...mapGetters(["orgId"]),
+  },
+  methods: {
+    initDeviceTypeList(){
+          thresholdTypeList()
+            .then((r) => {
+              // 使用 map 而不是 filter 进行数据转换
+              const transformedList = r.map((item) => ({
+                value: item.value,
+                label: item.label,
+                type: item.type,
+              }));
+
+              // 将转换后的数据推送到 this.deviceTypeList
+              this.deviceTypes.push(...transformedList);
+            })
+            .catch((error) => {
+              // 处理错误
+              console.error('Error fetching device type list:', error);
+            });
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      list(this.queryParams).then((response) => {
+        this.dataList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消弹框
+    closeHandler() {
+      this.reset();
+    },
+    handleImport() {},
+    getDefaultOrg(org) {
+      this.orgName = org.name;
+      this.selectedOrgName = org.shortName;
+    },
+
+    getDefaultKey(key) {
+      this.queryParams.orgId = key;
+      this.getList();
+    },
+    checkChange(state) {
+      this.queryParams.checkSub = state;
+      this.handleQuery();
+    },
+    // 节点单击事件
+    clickTreeNode(data) {
+      this.queryParams.orgId = data.id;
+      this.orgName = data.name;
+      this.selectedOrgName = data.shortName;
+      this.handleQuery();
+    },
+    /** 下穿状态改变*/
+    changeCheckBox() {
+      this.getList();
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        orgId: null,
+        orgPath: null,
+        orgName: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.queryParams.orgId = this.orgId;
+      this.selectedOrgName = this.orgName;
+      this.queryParams.checkSub = true;
+      this.queryParams.planStartTime = null;
+      this.$refs["orgTree"].setCheckSub(this.queryParams.checkSub);
+      this.handleQuery();
+    },
+
+    /** 修改按钮操作 */
+    lookView(row) {
+      this.$refs["detailDialog"].show(row);
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      if (this.total==null || this.total===0){
+        this.$modal.alert("暂无可用数据导出");
+        return;
+      }
+      if (this.total>50000){
+        this.$modal.alert("导出数据超过5万条，请缩小查询范围后重试");
+        return;
+      }
+      this.download(
+        "iot/sensor/export",
+        {
+          ...this.queryParams,
+        },
+        `${
+          this.selectedOrgName
+        }-${this.$tab.getCurrentTabName()}-${dayjs().format("YYYYMMDD")}.xlsx`
+      );
+    },
+  },
+};
+</script>
+<style lang="scss" scoped></style>