mqtt新增站点、qos

src/views/ems/site/mqtt/index.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
     <el-form :inline="true" class="select-container">
+      <el-form-item label="站点选择">
+        <el-select v-model="form.siteId" placeholder="请选择换电站名称" :loading="searchLoading" loading-text="正在加载数据" clearable>
+          <el-option :label="item.siteName" :value="item.siteId" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item label="订阅topic">
         <el-input
             v-model="form.mqttTopic"
@@ -29,6 +34,14 @@
         max-height="600px"
         stripe
         style="width: 100%;margin-top: 25px">
+        <el-table-column
+          label="站点"
+          prop="siteId">
+      </el-table-column>
+      <el-table-column
+          label="消息等级"
+          prop="qos">
+      </el-table-column>
       <el-table-column
           label="订阅topic"
           prop="mqttTopic">
@@ -77,6 +90,7 @@
 
 <script>
 import {deleteMqtt,getMqttList} from '@/api/ems/site'
+import {getAllSites} from '@/api/ems/zddt'
 import AddMqtt from './AddMqtt.vue'
 export default {
   name: "Mqtt",
@@ -85,9 +99,12 @@ export default {
   data() {
     return {
       form:{
+        siteId:"",
         topicName:'',
         mqttTopic:''
       },
+      siteList:[],
+      searchLoading:false,
       loading:false,
       tableData:[],
       pageSize:10,//分页栏当前每个数据总数
@@ -116,17 +133,26 @@ export default {
     },
     onReset(){
       this.form={
+        siteId:'',
         topicName:'',
         mqttTopic:''
       }
       this.pageNum =1//每次搜索从1开始搜索
       this.getData()
     },
+    //获取站点列表
+    getZdList(){
+      this.searchLoading=true
+      return getAllSites().then(response => {
+        this.siteList = response?.data || []
+      //  if( this.siteList.length>0 ) this.siteId = this.siteList[0].siteId
+      }).finally(() => {this.searchLoading=false})
+    },
     getData(){
       this.loading=true;
-      const {mqttTopic,topicName} = this.form;
+      const {mqttTopic,topicName,siteId} = this.form;
       const {pageNum,pageSize} = this;
-      getMqttList({pageNum,pageSize,mqttTopic,topicName}).then(response => {
+      getMqttList({pageNum,pageSize,mqttTopic,topicName,siteId}).then(response => {
         this.tableData=response?.rows || [];
         this.totalSize = response?.total || 0
       }).finally(() => {this.loading=false})
@@ -168,6 +194,7 @@ export default {
   },
   mounted() {
     this.loading=true
+    this.getZdList()
     this.getData()
   }
 }