fast(设备管理、告警管理): 设备管理、报警记录、预警记录添加项目查询和项目显示

src/views/iot/alarm/waringRecord/index.vue

@@ -2,40 +2,50 @@
   <!-- 告警记录功能 -->
   <div class="app-container alarm-record">
     <el-form
-      :model="queryParams"
+      v-show="showSearch"
       ref="queryForm"
       :inline="true"
-      v-show="showSearch"
+      :model="queryParams"
       label-width="68px"
     >
+      <el-form-item label="所属项目" prop="inProject">
+        <el-select v-model="queryParams.inProject" clearable placeholder="请选择所属项目" size="small">
+          <el-option
+            v-for="(item, index) in inProjectList"
+            :key="item.projectId"
+            :label="item.projectName"
+            :value="item.projectId"
+          />
+        </el-select>
+      </el-form-item>
       <el-form-item label="预警时间" prop="alarmTime">
         <el-date-picker
           v-model="time"
-          size="small"
-          @change="queryTimeChange"
-          clearable
-          type="datetimerange"
           :default-time="['00:00:00', '23:59:59']"
-          range-separator="至"
-          start-placeholder="开始日期"
+          clearable
           end-placeholder="结束日期"
+          range-separator="至"
+          size="small"
+          start-placeholder="开始日期"
+          type="datetimerange"
+          @change="queryTimeChange"
         >
         </el-date-picker>
       </el-form-item>
-      <el-form-item label="告警类型" prop="typeName">
+      <el-form-item label="预警类型" prop="typeName">
         <el-input
           v-model="queryParams.typeName"
-          placeholder="请输入告警类型"
           clearable
+          placeholder="请输入预警类型"
           size="small"
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
       <el-form-item>
         <el-button
-          type="primary"
           icon="el-icon-search"
           size="mini"
+          type="primary"
           @click="handleQuery"
           >搜索</el-button
         >
@@ -43,10 +53,10 @@
           >重置</el-button
         >
         <el-button
-          type="warning"
-          plain
           icon="el-icon-download"
+          plain
           size="mini"
+          type="warning"
           @click="handleExport"
           >导出</el-button
         >
@@ -60,29 +70,29 @@
       @sort-change="sortChange"
     >
       <el-table-column
-        type="index"
-        label="序号"
-        align="center"
         :index="indexFormatter"
-        width="80px"
+        align="center"
+        label="序号"
+        type="index"
+        width="60"
       ></el-table-column>
       <el-table-column
-        label="设备名称"
         align="left"
-        width="200px"
+        label="设备名称"
         prop="deviceName"
       />
+      <el-table-column align="center" label="所属项目" prop="inProjectName" />
       <!-- <el-table-column label="设备当前值" align="left" width="200px" prop="currentValue" >
         <template slot-scope="scope">
           <span style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">{{scope.row.currentValue}}</span>
         </template>
       </el-table-column> -->
-      <el-table-column label="推送内容" align="left" prop="alarmContent" />
+      <el-table-column align="left" label="推送内容" prop="alarmContent" />
       <el-table-column
-        label="预警时间"
         align="center"
-        sortable="custom"
+        label="预警时间"
         prop="alarmTime"
+        sortable="custom"
         width="150"
       >
         <template slot-scope="scope">
@@ -92,24 +102,21 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="处理状态"
-        width="100px"
-        align="center"
-        prop="processState"
         :formatter="stateFormatter"
-      />
-      <el-table-column
-        label="处理结果"
-        align="left"
-        sortable="custom"
-        width="150px"
-        prop="processResult"
-      />
-      <el-table-column
-        label="处理时间"
         align="center"
+        label="处理状态"
+        prop="processState"
+      />
+      <el-table-column
+        align="left"
+        label="处理结果"
+        prop="processResult"
+        sortable="custom"
+      />
+      <el-table-column
+        align="center"
+        label="处理时间"
         prop="processTime"
-        width="150"
       >
         <template slot-scope="scope">
           <span>{{
@@ -118,31 +125,29 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="告警类型"
         align="left"
-        width="150px"
+        label="告警类型"
         prop="typeName"
       />
       <!-- <el-table-column label="类型编码" align="left" width="150px" prop="typeCode" /> -->
       <el-table-column
-        label="操作"
-        width="150"
         align="center"
         class-name="small-padding fixed-width"
+        label="操作"
       >
         <template slot-scope="scope">
           <el-button
+            v-show="scope.row.processStatus === '0'"
+            icon="el-icon-edit"
             size="mini"
             type="text"
-            icon="el-icon-edit"
-            v-show="scope.row.processStatus === '0'"
             @click="handleUpdate(scope.row)"
             >处理</el-button
           >
           <el-button
+            icon="el-icon-document-add"
             size="mini"
             type="text"
-            icon="el-icon-document-add"
             @click="handleWork(scope.row)"
             >创建工单</el-button
           >
@@ -152,9 +157,9 @@
 
     <pagination
       v-show="total > 0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
       :limit.sync="queryParams.pageSize"
+      :page.sync="queryParams.pageNum"
+      :total="total"
       @pagination="getList"
     />
   </div>
@@ -168,6 +173,7 @@ import {
   addAlarmRecord,
   handlerRecord,
 } from "@/api/alarm/record";
+import { listProject } from "@/api/tenant/project";
 
 export default {
   name: "WarningRecord",
@@ -198,6 +204,7 @@ export default {
         pageSize: 10,
         typeName: null,
         typeCode: null,
+        inProject: null,
         beginTime: null,
         endTime: null,
         alarmDivide: "WARNING",
@@ -209,12 +216,25 @@ export default {
       // 表单校验
       rules: {},
       time: [],
+      inProjectList:[],
     };
   },
   created() {
     this.getList();
+    this.getInProjectList();
   },
   methods: {
+    // 查询所属项目列表
+    getInProjectList() {
+      listProject({
+        pageNum: 1,
+        pageSize: 100,
+        orderByColumn: 'createTime',
+        isAsc: 'desc'
+      }).then(response => {
+        this.inProjectList = response.rows;
+      });
+    },
     // 处理告警
     handleUpdate(row) {
       const recordId = row.recordId || this.ids;

src/views/iot/device/index.vue

@@ -14,6 +14,16 @@
         :model="queryParams"
         label-width="68px"
       >
+        <el-form-item label="所属项目" prop="inProject">
+          <el-select v-model="queryParams.inProject" clearable placeholder="请选择所属项目" size="small">
+            <el-option
+              v-for="(item, index) in inProjectList"
+              :key="item.projectId"
+              :label="item.projectName"
+              :value="item.projectId"
+            />
+          </el-select>
+        </el-form-item>
         <el-form-item label="型号名称" prop="modelName">
           <el-input
             v-model="queryParams.modelName"
@@ -129,7 +139,7 @@
           align="center"
           label="序号"
           type="index"
-          width="80px"
+          width="60px"
         ></el-table-column>
         <el-table-column align="left" label="设备名称" prop="deviceName" >
           <template slot-scope="scope">
@@ -137,6 +147,7 @@
           </template>
         </el-table-column>
         <el-table-column align="left" label="所属型号" prop="modelName" />
+        <el-table-column align="center" label="所属项目" prop="inProjectName" />
         <el-table-column align="left" label="设备key" prop="deviceKey"  />
         <el-table-column
           align="center"
@@ -167,7 +178,6 @@
           align="center"
           label="设备状态"
           prop="deviceState"
-          width="120"
         >
           <template slot-scope="scope">
             <el-tag v-if="scope.row.deviceState === 'ONLINE'" type="success"
@@ -437,6 +447,7 @@ import GatewayDetail from "@/views/profile/DeviceDetailsView/index";
 import EDialogTableInput from "@/components/EDialogTableInput";
 import DialogTemplate from "@/components/DialogTemplate";
 import JsBarcode from "jsbarcode"
+import { listProject } from "@/api/tenant/project";
 
 const deviceStatusOpt = {
   ONLINE: "在线",
@@ -459,6 +470,7 @@ const selectModelTable = {
     params: {
       protocolType: "",
       modelName: "",
+
     },
     inline: true,
     queryChilds: [
@@ -680,6 +692,8 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      // 弹出层标题
+      inProjectList:[],
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -690,6 +704,7 @@ export default {
         deviceState: null,
         deviceType: null,
         modelName: null,
+        inProject: null,
         orderByColumn: "createTime",
         isAsc: "desc",
       },
@@ -730,6 +745,7 @@ export default {
   created() {
     console.log(this.$route);
     this.init();
+    this.getInProjectList();
   },
   methods: {
     listModel,
@@ -742,6 +758,17 @@ export default {
       this.form.prodKey = e.prodKey;
       this.deviceTypeChange(this.form.deviceType);
     },
+    // 查询所属项目列表
+    getInProjectList() {
+      listProject({
+        pageNum: 1,
+        pageSize: 100,
+        orderByColumn: 'createTime',
+        isAsc: 'desc'
+      }).then(response => {
+        this.inProjectList = response.rows;
+      });
+    },
     handleDeviceDialogEvent(e) {
       this.form.parentId = e.deviceId;
       this.form.parentName = e.deviceName;

src/views/personal/waring/index.vue

@@ -2,40 +2,50 @@
   <!-- 告警记录功能 -->
   <div class="app-container alarm-record">
     <el-form
-      :model="queryParams"
+      v-show="showSearch"
       ref="queryForm"
       :inline="true"
-      v-show="showSearch"
+      :model="queryParams"
       label-width="68px"
     >
+      <el-form-item label="所属项目" prop="inProject">
+        <el-select v-model="queryParams.inProject" clearable placeholder="请选择所属项目" size="small">
+          <el-option
+            v-for="(item, index) in inProjectList"
+            :key="item.projectId"
+            :label="item.projectName"
+            :value="item.projectId"
+          />
+        </el-select>
+      </el-form-item>
       <el-form-item label="预警时间" prop="alarmTime">
         <el-date-picker
           v-model="time"
-          size="small"
-          @change="queryTimeChange"
-          clearable
-          type="datetimerange"
-          range-separator="至"
-          start-placeholder="开始日期"
           :default-time="['00:00:00', '23:59:59']"
+          clearable
           end-placeholder="结束日期"
+          range-separator="至"
+          size="small"
+          start-placeholder="开始日期"
+          type="datetimerange"
+          @change="queryTimeChange"
         >
         </el-date-picker>
       </el-form-item>
-      <el-form-item label="告警类型" prop="typeName">
+      <el-form-item label="预警类型" prop="typeName">
         <el-input
           v-model="queryParams.typeName"
-          placeholder="请输入告警类型"
           clearable
+          placeholder="请输入预警类型"
           size="small"
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
       <el-form-item>
         <el-button
-          type="primary"
           icon="el-icon-search"
           size="mini"
+          type="primary"
           @click="handleQuery"
           >搜索</el-button
         >
@@ -48,12 +58,12 @@
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
           v-hasPermi="['iot:record:export']"
+          icon="el-icon-download"
+          plain
+          size="mini"
+          type="warning"
+          @click="handleExport"
           >导出</el-button
         >
       </el-col>
@@ -70,30 +80,31 @@
       @sort-change="sortChange"
     >
       <el-table-column
-        type="index"
-        label="序号"
-        align="center"
         :index="indexFormatter"
+        align="center"
+        label="序号"
+        type="index"
         width="80px"
       ></el-table-column>
       <el-table-column
-        label="设备名称"
         align="left"
-        width="200px"
+        label="设备名称"
         prop="deviceName"
+        width="200px"
       />
+      <el-table-column align="center" label="所属项目" prop="inProjectName" />
       <!-- <el-table-column label="设备当前值" align="left" width="200px" prop="currentValue" >
         <template slot-scope="scope">
           <span style="text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">{{scope.row.currentValue}}</span>
         </template>
       </el-table-column> -->
-      <el-table-column label="推送内容" align="left" prop="alarmContent" />
+      <el-table-column align="left" label="推送内容" prop="alarmContent" />
       <el-table-column
-        label="预警时间"
         align="center"
+        label="预警时间"
         prop="alarmTime"
-        width="150"
         sortable="custom"
+        width="150"
       >
         <template slot-scope="scope">
           <span>{{
@@ -102,24 +113,24 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="处理状态"
-        width="100px"
-        align="center"
-        prop="processState"
         :formatter="stateFormatter"
-      />
-      <el-table-column
-        label="处理结果"
-        align="left"
-        width="150px"
-        prop="processResult"
-      />
-      <el-table-column
-        label="处理时间"
         align="center"
+        label="处理状态"
+        prop="processState"
+        width="100px"
+      />
+      <el-table-column
+        align="left"
+        label="处理结果"
+        prop="processResult"
+        width="150px"
+      />
+      <el-table-column
+        align="center"
+        label="处理时间"
         prop="processTime"
-        width="150"
         sortable="custom"
+        width="150"
       >
         <template slot-scope="scope">
           <span>{{
@@ -128,31 +139,31 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="告警类型"
         align="left"
-        width="150px"
+        label="告警类型"
         prop="typeName"
+        width="150px"
       />
       <!-- <el-table-column label="类型编码" align="left" width="150px" prop="typeCode" /> -->
       <el-table-column
-        label="操作"
-        width="200"
         align="center"
         class-name="small-padding fixed-width"
+        label="操作"
+        width="200"
       >
         <template slot-scope="scope">
           <el-button
+            v-show="scope.row.processStatus === '0'"
+            icon="el-icon-edit"
             size="mini"
             type="text"
-            icon="el-icon-edit"
-            v-show="scope.row.processStatus === '0'"
             @click="handleUpdate(scope.row)"
             >处理</el-button
           >
           <el-button
+            icon="el-icon-document-add"
             size="mini"
             type="text"
-            icon="el-icon-document-add"
             @click="handleWork(scope.row)"
             >创建工单</el-button
           >
@@ -162,9 +173,9 @@
 
     <pagination
       v-show="total > 0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
       :limit.sync="queryParams.pageSize"
+      :page.sync="queryParams.pageNum"
+      :total="total"
       @pagination="getList"
     />
   </div>
@@ -174,6 +185,7 @@
 import { listRecord, exportRecord } from "@/api/personal/alarm";
 import { addAlarmRecord } from "@/api/alarm/tenantAlarm";
 import { handlerRecord } from "@/api/alarm/record";
+import { listProject } from "@/api/tenant/project";
 
 export default {
   name: "WarningRecord",
@@ -204,6 +216,7 @@ export default {
         pageSize: 10,
         typeName: null,
         typeCode: null,
+        inProject: null,
         beginTime: null,
         endTime: null,
         alarmDivide: "WARNING",
@@ -213,12 +226,25 @@ export default {
       // 表单校验
       rules: {},
       time: [],
+      inProjectList:[],
     };
   },
   created() {
     this.getList();
+    this.getInProjectList();
   },
   methods: {
+    // 查询所属项目列表
+    getInProjectList() {
+      listProject({
+        pageNum: 1,
+        pageSize: 100,
+        orderByColumn: 'createTime',
+        isAsc: 'desc'
+      }).then(response => {
+        this.inProjectList = response.rows;
+      });
+    },
     sortChange(column) {
       const sort = {
         isAsc: column.order === "descending" ? "desc" : "asc",