`fix`

ruoyi-ui-vue3/src/api/data/equipment.js

@@ -9,6 +9,15 @@ export function listEquipment(query) {
   })
 }
 
+
+export function listGatewayEquipments(query) {
+  return request({
+    url: '/data/equipment/alllist',
+    method: 'get',
+    params: query
+  })
+}
+
 // 查询设备详细
 export function getEquipment(id) {
   return request({

ruoyi-ui-vue3/src/router/index.js

@@ -196,8 +196,8 @@ export const constantRoutes = [
       {
         path: "",
         component: () => import("@/views/gateway/manager/add"),
-        name: "PointSettingAdd" ,
-        meta: { title: "网关新增", activeMenu: "/gateway/manager/add" },
+        name: "gatewayAdd" ,
+        meta: { title:  "网关新增", activeMenu: "/gateway/manager/add" },
       },
     ],
   }

ruoyi-ui-vue3/src/views/device/device/index.vue

@@ -12,12 +12,12 @@
             "
           >
             <div style="font-size: 12px; width: 80px">设备名称:</div>
-            <el-input v-model="searchform.devicename" placeholder="设备名称"></el-input>
+            <el-input v-model="searchform.name" placeholder="设备名称"></el-input>
           </div>
         </div>
         <div>
-          <el-button type="primary" plain>重置</el-button>
-          <el-button type="primary">搜索</el-button>
+          <el-button type="primary" plain @click="initdata">重置</el-button>
+          <el-button type="primary" @click="getalldata">搜索</el-button>
         </div>
       </div>
     </el-card>
@@ -27,22 +27,19 @@
           <span>设备管理</span>
 
           <div>
-            <el-button type="primary">添加</el-button>
+            <el-button type="primary" @click="adddevice">添加</el-button>
             <el-button type="danger">批量删除</el-button>
-            <el-button type="primary" plain>显示字段</el-button>
+            <el-button type="primary" plain @click="ziduanshow=true">显示字段</el-button>
           </div>
         </div>
       </template>
 
       <el-row>
         <el-col :span="24" style="padding-left: 10px">
-          <el-table :data="devicetabledata" :border="true">
+          <el-table ref="multipleTable" :data="devicetabledata" :border="true">
             <el-table-column type="selection" width="55"></el-table-column>
-            <el-table-column prop="name" label="设备名称"></el-table-column>
-            <el-table-column prop="model" label="型号"></el-table-column>
-            <el-table-column prop="type" label="设备类型"></el-table-column>
-            <el-table-column prop="manufacturer" label="生产厂商"></el-table-column>
-            <el-table-column prop="producer" label="制造商"></el-table-column>
+            <el-table-column v-for="item in cloumdata.filter(i=>i.visible)" :prop="item.prop" :label="item.label" >
+            </el-table-column>
             <el-table-column label="操作">
               <template #default="scope">
                 <div>
@@ -70,37 +67,190 @@
         </el-col>
         <el-col :span="24" style="margin-top: 10px;">
           <el-pagination style="float: right;"
-            small
-            background
-            layout="prev, pager, next"
-            :total="50"
-            class="mt-4"
+                         small
+                         background
+                         layout="prev, pager, next"
+                         :total="pagedata.total"
+                         :page-size="pagedata.size"
+                         :current-page="pagedata.current"
+                         @current-change="onchangepage"
+                         class="mt-4"
           />
         </el-col>
       </el-row>
     </el-card>
+
+
+    <el-dialog
+      title="添加设备"
+      v-model="addshow"
+      width="50%"
+      @close="addshow = false"
+    >
+      <div>
+        <el-descriptions :column="2">
+          <el-descriptions-item label="设备名称">
+            <template #label>
+              <div style="display: inline-block;min-width: 100px;text-align: right">
+                设备名称
+              </div>
+            </template>
+            <div class="content-w">
+                <el-input v-model="currentdata.name" placeholder="设备名称" />
+            </div>
+          </el-descriptions-item>
+          <el-descriptions-item label="设备型号">
+            <template #label>
+              <div style="display: inline-block;min-width: 100px;text-align: right">
+                设备型号
+              </div>
+            </template>
+            <div class="content-w">
+                <el-input v-model="currentdata.model" placeholder="设备型号"  />
+            </div>
+          </el-descriptions-item>
+          <el-descriptions-item label="设备类型">
+            <template #label>
+              <div style="display: inline-block;min-width: 100px;text-align: right">
+                设备类型
+              </div>
+            </template>
+            <div class="content-w">
+              <el-input v-model="currentdata.type" placeholder="设备类型" />
+            </div>
+          </el-descriptions-item>
+          <el-descriptions-item label="生产厂商">
+            <template #label>
+              <div style="display: inline-block;min-width: 100px;text-align: right">
+                生产厂商
+              </div>
+            </template>
+            <div class="content-w">
+                <el-input v-model="currentdata.producer" placeholder="生产厂商"  />
+            </div>
+          </el-descriptions-item>
+          <el-descriptions-item label="制造商">
+            <template #label>
+               <div style="display: inline-block;min-width: 100px;text-align: right">
+                 制造商
+               </div>
+           </template>
+          <div class="content-w">
+            <el-input v-model="currentdata.manufacturer" placeholder="制造商"  />
+           </div>
+          </el-descriptions-item>
+
+        </el-descriptions>
+
+      </div>
+      <div slot="footer" class="dialog-footer" style="text-align: right" >
+        <el-button @click="addshow = false">取 消</el-button>
+        <el-button type="primary" @click="dosave">保 存</el-button>
+      </div>
+
+    </el-dialog>
+
+    <el-dialog
+      title="字段显示"
+      v-model="ziduanshow"
+      width="50%"
+      @close="ziduanshow = false"
+    >
+      <div style="display: flex;flex-wrap: wrap;align-content: center;justify-content: center;align-items: center;">
+        <el-checkbox v-for="item in cloumdata" v-model="item.visible" :label="item.label" size="large" />
+      </div>
+
+    </el-dialog>
   </div>
 </template>
 
 <script setup lang="ts" name="Units">
-import {ref} from "vue";
-import {listEquipment} from "@/api/data/equipment"
+import {ref, watch} from "vue";
+import {listEquipment,addEquipment,delEquipment,updateEquipment} from "@/api/data/equipment"
+import moment from "moment/moment";
+
+const addshow  = ref(false);
 
+const ziduanshow = ref(false);
+const cloumdata = ref([
+  {label: '设备名称', prop:'name',visible:true},
+  {label: '型号', prop:'model',visible:true},
+  {label: '设备类型', prop:'type',visible:true},
+  {label: '生产厂商', prop:'manufacturer',visible:true},
+  {label: '制造商', prop:'producer',visible:true},
+]);
+
+
+const  currentdata = ref({ "name": "",
+  "sn": "",
+  "model": "",
+  "specs": "",
+  "type": "",
+  "equipmentTypeId": 93,
+  "manufacturer": "",
+  "producer": "",
+  "pictures": "",
+  "remark": "",
+  "gatewayId": null,
+  "protocalType": null})
 
 const searchform = ref({
-  devicename: "",
+  name: "",
 });
 
+const pagedata = ref({
+  total:0,
+  size:10,
+  current:1
+});
+
+const initdata = ()=>{
+  searchform.value = {
+    name:""
+  }
+  pagedata.value = {
+    total:0,
+    size:10,
+    current:1
+  }
+}
+
+const adddevice = ()=>{
+  addshow.value=true;
+  initdata();
+}
+
+const dosave = ()=>{
+  if(currentdata.value["id"]!=undefined){
+    updateEquipment(currentdata.value).then((res) => {
+        addshow.value=false;
+        getalldata();
+    });
+  }else{
+    addEquipment(currentdata.value).then((res) => {
+      addshow.value=false;
+      getalldata();
+    });
+
+  }
+
+}
+
+const onchangepage = (page) => {
+  pagedata.value.current = page;
+  getalldata();
+}
+
 const gettbheight = () => {
   return window.innerHeight - 280;
 };
 
-const devicetabledata = ref([1]);
+const devicetabledata = ref([]);
 
 
 
 const getalldata = ()=>{
-  listEquipment({}).then((res) => {
+  listEquipment({...searchform.value,pageSize:pagedata.value.size,pageNum:pagedata.value.current}).then((res) => {
     const {rows} = res;
     devicetabledata.value = rows;
   });
@@ -118,4 +268,9 @@ getalldata();
   flex-direction: row;
   justify-content: space-between;
 }
+.content-w {
+  display: inline-flex;
+
+
+}
 </style>

ruoyi-ui-vue3/src/views/device/equipmentdash/index.vue

@@ -5,10 +5,9 @@
     <el-card class="box-card">
       <template #header>
         <div class="card-header">
-          <span>东门立柱摄像-详情</span>
+          <span>设备台账区域</span>
           <div>
             <el-button type="primary" plain >
-
               添加
             </el-button>
           </div>

ruoyi-ui-vue3/src/views/gateway/manager/add.vue

@@ -3,10 +3,10 @@
     <el-card class="box-card">
       <template #header>
         <div class="card-header">
-          <span>网关管理-新增</span>
+          <span>网关管理-{{route.query['type']==1?'编辑':'新增'}}</span>
           <div>
-            <el-button type="warning" @click="">复位</el-button>
-            <el-button type="primary" @click="">保存</el-button>
+            <el-button type="warning" @click="initdata">复位</el-button>
+            <el-button type="primary" @click="savedata">保存</el-button>
             <el-button type="primary" plain @click="router.back();">返回</el-button>
           </div>
         </div>
@@ -24,7 +24,7 @@
 
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.name" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
               <el-descriptions-item>
@@ -34,7 +34,7 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.sn" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
 
@@ -45,7 +45,7 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.gatewayId" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
               <el-descriptions-item >
@@ -55,7 +55,9 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-select v-model="currentgateway.status">
+                    <el-option v-for="item in gateway_status" :key="item.value" :value="item.value" :label="item.label"></el-option>
+                  </el-select>
                 </div>
               </el-descriptions-item>
 
@@ -66,7 +68,7 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.remoteManage" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
 
@@ -77,7 +79,9 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.flowControl" placeholder="请输入"/><el-select v-model="currentgateway.flowControlType">
+                  <el-option v-for="item in flow_units" :key="item.value" :value="item.value" :label="item.label"></el-option>
+                </el-select>
                 </div>
               </el-descriptions-item>
 
@@ -88,7 +92,7 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.belongService" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
               <el-descriptions-item >
@@ -98,31 +102,43 @@
                   </div>
                 </template>
                 <div class="content-w">
-                  <el-input placeholder="请输入"/>
+                  <el-input v-model="currentgateway.version" placeholder="请输入"/>
                 </div>
               </el-descriptions-item>
 
+              <el-descriptions-item :span="4">
+                <template #label>
+                  <div style="display: inline-block;min-width: 100px;text-align: right;    vertical-align: top;">
+                    <span style="color: red">*</span> 协议
+                  </div>
+                </template>
+                <div class="content-w" style="min-width: 550px">
+                  <el-select @change="changeProtocalType" v-model="currentgateway.protocalType" placeholder="请选择">
+                    <el-option v-for="item in protocal_type" :key="item.value" :value="parseInt(item.value)" :label="item.label"></el-option>
+                  </el-select>
+                  <el-select v-if="currentgateway.protocalType!=3" v-model="currentgateway.protocalId" placeholder="请选择">
+                    <el-option v-for="item in protocallist" :key="item.name" :value="item.id" :label="item.protocolName"></el-option>
+                  </el-select>
+
+                </div>
+              </el-descriptions-item>
 
-              <el-descriptions-item :span="2">
+
+              <el-descriptions-item :span="4">
                 <template #label>
                   <div style="display: inline-block;min-width: 100px;text-align: right;    vertical-align: top;">
                     描述
                   </div>
                 </template>
                 <div class="content-w" style="min-width: 550px">
-                  <el-input type="textarea" :line-count="5"  show-word-limit maxlength="200" placeholder="请输入描述"/>
+                  <el-input v-model="currentgateway.description" type="textarea" :line-count="5"  show-word-limit maxlength="200" placeholder="请输入描述"/>
                 </div>
               </el-descriptions-item>
 
             </el-descriptions>
 
         </el-col>
-
       </el-row>
-
-
-
-
     </el-card>
 
     <el-card class="box-card" style="margin-top: 20px">
@@ -138,36 +154,7 @@
         <el-row>
           <el-col :span="24">
             <el-table :data="tabledata" border>
-              <el-table-column type="selection" width="55" />
-              <el-table-column label="上层位置"></el-table-column>
-              <el-table-column label="设备编码"></el-table-column>
-              <el-table-column label="备用编码"></el-table-column>
-              <el-table-column label="设备名称"></el-table-column>
-              <el-table-column label="设备信息"></el-table-column>
-              <el-table-column label="所属公司"></el-table-column>
-              <el-table-column label="所属组织机构"></el-table-column>
-              <el-table-column label="所属类型"></el-table-column>
-              <el-table-column label="负责人"></el-table-column>
-              <el-table-column label="安装日期"></el-table-column>
-              <el-table-column label="安装地点地址"></el-table-column>
-              <el-table-column label="关联设备Id"></el-table-column>
-              <el-table-column label="标签"></el-table-column>
-              <el-table-column label="状态"></el-table-column>
-              <el-table-column label="保修期结束日期"></el-table-column>
-              <el-table-column label="制造日期"></el-table-column>
-              <el-table-column label="资产编码"></el-table-column>
-              <el-table-column label="资产编号"></el-table-column>
-              <el-table-column label="使用证编号"></el-table-column>
-              <el-table-column label="安全级别"></el-table-column>
-              <el-table-column label="使用年限"></el-table-column>
-              <el-table-column label="变动日期"></el-table-column>
-              <el-table-column label="供货厂家"></el-table-column>
-              <el-table-column label="创建人"></el-table-column>
-              <el-table-column label="创建时间"></el-table-column>
-              <el-table-column label="更新人"></el-table-column>
-              <el-table-column label="更新时间"></el-table-column>
-              <el-table-column label="备注"></el-table-column>
-              <el-table-column label="设备编码"></el-table-column>
+              <el-table-column v-for="item in columns.filter(i=>i.visible)" :prop="item.prop" :label="item.label" ></el-table-column>
               <el-table-column label="操作" fixed="right" ></el-table-column>
 
             </el-table>
@@ -177,7 +164,10 @@
                            small
                            background
                            layout="prev, pager, next"
-                           :total="50"
+                           :total="pagedata.total"
+                           :page-size="pagedata.size"
+                           :current-page="pagedata.current"
+                           @current-change="onchangepage"
                            class="mt-4"
             />
           </el-col>
@@ -195,47 +185,21 @@
 
       <el-table height="400px">
         <el-table-column type="selection" width="55"  fixed="left" />
-        <el-table-column label="上层位置"></el-table-column>
-        <el-table-column label="设备编码"></el-table-column>
-        <el-table-column label="备用编码"></el-table-column>
-        <el-table-column label="设备名称"></el-table-column>
-        <el-table-column label="设备信息"></el-table-column>
-        <el-table-column label="所属公司"></el-table-column>
-        <el-table-column label="所属组织机构"></el-table-column>
-        <el-table-column label="所属类型"></el-table-column>
-        <el-table-column label="负责人"></el-table-column>
-        <el-table-column label="安装日期"></el-table-column>
-        <el-table-column label="安装地点地址"></el-table-column>
-        <el-table-column label="关联设备Id"></el-table-column>
-        <el-table-column label="标签"></el-table-column>
-        <el-table-column label="状态"></el-table-column>
-        <el-table-column label="保修期结束日期"></el-table-column>
-        <el-table-column label="制造日期"></el-table-column>
-        <el-table-column label="资产编码"></el-table-column>
-        <el-table-column label="资产编号"></el-table-column>
-        <el-table-column label="使用证编号"></el-table-column>
-        <el-table-column label="安全级别"></el-table-column>
-        <el-table-column label="使用年限"></el-table-column>
-        <el-table-column label="变动日期"></el-table-column>
-        <el-table-column label="供货厂家"></el-table-column>
-        <el-table-column label="创建人"></el-table-column>
-        <el-table-column label="创建时间"></el-table-column>
-        <el-table-column label="更新人"></el-table-column>
-        <el-table-column label="更新时间"></el-table-column>
-        <el-table-column label="备注"></el-table-column>
-        <el-table-column label="设备编码"></el-table-column>
-
+        <el-table-column v-for="item in columns.filter(i=>i.visible)" :prop="item.prop" :label="item.label" ></el-table-column>
       </el-table>
 
       <div style="text-align: center;display: flex;justify-content: center;margin-top: 10px" >
 
-          <el-pagination
-                         small
-                         background
-                         layout="prev, pager, next"
-                         :total="50"
-                         class="mt-4"
-          />
+        <el-pagination style="float: right;"
+                       small
+                       background
+                       layout="prev, pager, next"
+                       :total="pagedata.total"
+                       :page-size="pagedata.size"
+                       :current-page="pagedata.current"
+                       @current-change="onchangepage"
+                       class="mt-4"
+        />
 
       </div>
 
@@ -246,18 +210,144 @@
   </div>
 </template>
 
-<script setup lang="ts" >
-import {ref} from "vue";
+<script setup>
+import {onMounted, ref} from "vue";
 import {useRoute, useRouter} from "vue-router";
-import ModbusTcp from "@/views/data/modbusTcp/index.vue";
+
+const {proxy} = getCurrentInstance();
+const {gateway_status, flow_units, protocal_type} = proxy.useDict("gateway_status", "flow_units", "protocal_type");
+import {listModbusRtu} from "@/api/data/modbusRtu";
+import {listModbusTcp} from "@/api/data/modbusTcp";
+import {updateGateway} from "@/api/data/gateway";
+import {listGatewayEquipments} from "@/api/data/equipment"
+import {ElMessage} from "element-plus";
 
 
 const route = useRoute();
 const router = useRouter();
 
+const columns = ref([
+  {label: '上层位置', prop: 'v', visible: true},
+  {label: '设备编码', prop: 'commPortId', visible: true},
+  {label: '备用编码', prop: 'commPortType', visible: true},
+  {label: '设备名称', prop: 'baudRate', visible: true},
+  {label: '设备信息', prop: 'dateBits', visible: true},
+  {label: '所属公司', prop: 'parity', visible: true},
+  {label: '所属组织机构', prop: 'stopBits', visible: true},
+  {label: '所属类型', prop: 'apiUrl', visible: true},
+  {label: '负责人', prop: 'uuid', visible: true},
+  {label: '安装日期', prop: 'intervals', visible: true},
+  {label: '安装地点地址', prop: 'protocolDesc', visible: true},
+  {label: '关联设备Id', prop: 'protocolDesc', visible: true},
+  {label: '标签', prop: 'protocolDesc', visible: true},
+  {label: '状态', prop: 'protocolDesc', visible: true},
+  {label: '保修期结束日期', prop: 'protocolDesc', visible: true},
+  {label: '制造日期', prop: 'protocolDesc', visible: true},
+  {label: '资产编码', prop: 'protocolDesc', visible: true},
+  {label: '资产编号', prop: 'protocolDesc', visible: true},
+  {label: '使用证编号', prop: 'protocolDesc', visible: true},
+  {label: '安全级别', prop: 'protocolDesc', visible: true},
+  {label: '变动日期', prop: 'protocolDesc', visible: true},
+  {label: '供货厂家', prop: 'protocolDesc', visible: true},
+  {label: '创建人', prop: 'protocolDesc', visible: true},
+  {label: '创建时间', prop: 'protocolDesc', visible: true},
+  {label: '更新人', prop: 'protocolDesc', visible: true},
+  {label: '更新时间', prop: 'protocolDesc', visible: true},
+  {label: '备注', prop: 'protocolDesc', visible: true},
+  {label: '设备编码', prop: 'protocolDesc', visible: true},
+
+])
+
+const currentgateway = ref({
+  "sn": "",
+  "name": "",
+  "gatewayId": "",
+  "status": "",
+  "remoteManage": "",
+  "flowControl": 0,
+  "flowControlType": "",
+  "belongService": "",
+  "description": "",
+  "remark": "",
+  "protocalType": null,
+  "protocalId": null,
+  "longitude": null,
+  "latitude": null
+});
+
+
+const savedata = () => {
+  updateGateway(currentgateway.value).then(res => {
+    ElMessage.success("修改成功")
+  });
+}
+const initdata = () => {
+  currentgateway.value = {
+    "sn": "",
+    "name": "",
+    "gatewayId": "",
+    "status": "",
+    "remoteManage": "",
+    "flowControl": 0,
+    "flowControlType": "",
+    "belongService": "",
+    "description": "",
+    "remark": "",
+    "protocalType": null,
+    "protocalId": null,
+    "longitude": null,
+    "latitude": null
+  };
+}
+
+
+const protocallist = ref([]);
+
+const changeProtocalType = (item) => {
+
+  if (item == 1) {
+    listModbusTcp({pageSize: 10000}).then(res => {
+      protocallist.value = res.rows;
+    })
+  }
+  if (item == 2) {
+    listModbusRtu({pageSize: 10000}).then(res => {
+      protocallist.value = res.rows;
+    })
+  }
+}
+
+const onchangepage = (page) => {
+  pagedata.value.current = page;
+  getalldata();
+}
+
+const pagedata = ref({
+  total: 0,
+  size: 10,
+  current: 1
+});
+const getalldata = () => {
+  listGatewayEquipments({pageSize: 10000}).then(res => {
+    tabledata.value = res.rows;
+  })
+}
+getalldata();
+
+
 const addshow = ref(false);
 const tabledata = ref([1]);
 
+onMounted(() => {
+  if (route.query["type"] == 1) {
+    if (localStorage.getItem("gatewaydata")) {
+      currentgateway.value = JSON.parse(localStorage.getItem("gatewaydata"))
+    } else {
+      route.query["type"] = 0;
+    }
+  }
+})
+
 
 </script>
 

ruoyi-ui-vue3/src/views/gateway/manager/index.vue

@@ -13,7 +13,7 @@
           >
             <div style="font-size: 12px; width: 80px">名称:</div>
             <el-input
-              v-model="searchform.protocolname"
+              v-model="searchform.name"
               placeholder="名称"
             ></el-input>
           </div>
@@ -21,8 +21,8 @@
 
         </div>
         <div>
-          <el-button type="primary" plain>重置</el-button>
-          <el-button type="primary">搜索</el-button>
+          <el-button type="primary" plain @click="initdata">重置</el-button>
+          <el-button type="primary" @click="getalldata">搜索</el-button>
         </div>
       </div>
 
@@ -35,8 +35,8 @@
           <span>网关管理</span>
           <div>
             <el-button type="primary" @click="goadd">添加</el-button>
-            <el-button type="danger">批量删除</el-button>
-            <el-button type="primary" plain>显示字段</el-button>
+            <el-button type="danger" @click="deleteall">批量删除</el-button>
+            <el-button type="primary" plain @click="ziduanshow=true">显示字段</el-button>
           </div>
         </div>
 
@@ -46,19 +46,34 @@
       <div>
         <el-row>
           <el-col :span="24">
-            <el-table :data="tabledata" border>
+            <el-table ref="tableref" :data="tabledata" border>
               <el-table-column type="selection" width="55" />
-              <el-table-column label="名称"></el-table-column>
-              <el-table-column label="序列号"></el-table-column>
-              <el-table-column label="网关ID"></el-table-column>
-              <el-table-column label="状态"></el-table-column>
-              <el-table-column label="远程控制"></el-table-column>
-              <el-table-column label="流量控制"></el-table-column>
-              <el-table-column label="流量控制类型"></el-table-column>
-              <el-table-column label="所属服务"></el-table-column>
-              <el-table-column label="版本"></el-table-column>
-              <el-table-column label="描述"></el-table-column>
-              <el-table-column label="操作" fixed="right" ></el-table-column>
+              <el-table-column v-for="item in cloumdata.filter(i=>i.visible)" :prop="item.prop" :label="item.label" ></el-table-column>
+              <el-table-column label="操作" fixed="right" >
+                <template #default="scope">
+                  <div>
+                    <el-button
+                      link  @click="showdmodeletail(scope.row,2)"
+                    >
+                      <el-tooltip effect="dark" content="编辑">
+                        <el-icon>
+                          <Edit />
+                        </el-icon>
+                      </el-tooltip>
+                    </el-button>
+
+                    <el-popconfirm title="确定删除该网关?" @confirm="deleterow(scope.row)">
+                      <template #reference>
+                        <el-button link
+                        ><el-tooltip effect="dark" content="删除"
+                        ><el-icon><Delete /></el-icon></el-tooltip
+                        ></el-button>
+                      </template>
+                    </el-popconfirm>
+                  </div>
+                </template>
+
+              </el-table-column>
 
             </el-table>
           </el-col>
@@ -67,7 +82,10 @@
                            small
                            background
                            layout="prev, pager, next"
-                           :total="50"
+                           :total="pagedata.total"
+                           :page-size="pagedata.size"
+                           :current-page="pagedata.current"
+                           @current-change="onchangepage"
                            class="mt-4"
             />
           </el-col>
@@ -78,25 +96,125 @@
     </el-card>
 
 
+    <el-dialog
+      title="字段显示"
+      v-model="ziduanshow"
+      width="50%"
+      @close="ziduanshow = false"
+    >
+      <div style="display: flex;flex-wrap: wrap;align-content: center;justify-content: center;align-items: center;">
+        <el-checkbox v-for="item in cloumdata" v-model="item.visible" :label="item.label" size="large" />
+      </div>
+
+    </el-dialog>
+
+
   </div>
 </template>
 
 <script setup lang="ts" >
 import {ref} from "vue";
 import {useRoute, useRouter} from "vue-router";
+import {listGateway,addGateway,updateGateway,delGateway} from "@/api/data/gateway"
+import {ElMessage, ElMessageBox} from "element-plus";
 
 
 const route = useRoute();
 const router = useRouter();
 
+const  tableref = ref(null);
+
+const cloumdata = ref([
+  {label: '名称', prop:'name',visible:true},
+  {label: '序列号', prop:'sn',visible:true},
+  {label: '网关ID', prop:'gatewayId',visible:true},
+  {label: '状态', prop:'status',visible:true},
+  {label: '远程控制', prop:'remoteManage',visible:true},
+  {label: '流量控制', prop:'flowControl',visible:true},
+  {label: '流量控制类型', prop:'flowControlType',visible:true},
+  {label: '所属服务', prop:'belongService',visible:true},
+  {label: '版本', prop:'version',visible:true},
+  {label: '协议', prop:'protocalType',visible:true},
+  {label: '描述', prop:'description',visible:true},
+]);
+const ziduanshow = ref(false);
+
 const searchform = ref({
-  protocolname: '',
+  name: '',
 })
 
 const tabledata = ref([1])
 const goadd = ()=>{
-  router.push("/gateway/manager/add");
+  router.push("/gateway/manager/add?type=0");
+}
+
+const onchangepage = (page) => {
+  pagedata.value.current = page;
+  getalldata();
+}
+const pagedata = ref({
+  total:0,
+  size:10,
+  current:1
+});
+
+const initdata = () => {
+  searchform.value.name = '';
+  pagedata.value = {
+    total:0,
+    size:10,
+    current:1
+  }
+}
+
+const showdmodeletail = (item,type) => {
+  localStorage.setItem("gatewaydata",JSON.stringify(item));
+  router.push("/gateway/manager/add?type=1");
+}
+
+const deleterow =(item)=>{
+  delGateway(item.id).then((res)=>{
+    ElMessage.success("删除成功");
+    getalldata();
+  })
+}
+
+const deleteall = ()=>{
+  let selected =  tableref.value.getSelectionRows();
+  if(selected.length==0) {
+    ElMessage.warning("请选择要删除的行");
+    return;
+  }
+
+  if (selected.length > 0) {
+    ElMessageBox.confirm(
+      `是否删除${selected.length}条数据`,
+      "警告",
+      {
+        confirmButtonText: "确认",
+        cancelButtonText: "取消",
+        type: 'warning',
+      }
+    ).then(() => {
+
+      delGateway(selected.map(i => i.id).join(",")).then((res) => {
+        ElMessage.success("删除成功");
+        getalldata();
+      })
+
+    });
+  }
+
+}
+
+const getalldata = () => {
+  listGateway({...searchform.value,pageSize:pagedata.value.size,pageNum:pagedata.value.current}).then(res => {
+    const {rows,total,page,size} = res;
+    pagedata.value = {total:total,current:page, size:10};
+    tabledata.value = rows
+  })
 }
+getalldata()
 
 
 </script>

ruoyi-ui-vue3/src/views/gateway/modbusrtu/index.vue

@@ -44,7 +44,7 @@
       <div>
         <el-row>
           <el-col :span="24">
-            <el-table :data="tabledata" border>
+            <el-table ref="tableref" :data="tabledata" border>
               <el-table-column type="selection" width="55" />
               <el-table-column v-for="item in cloumdata.filter(i=>i.visible)" :prop="item.prop" :label="item.label" ></el-table-column>
               <el-table-column label="操作">
@@ -288,6 +288,11 @@ const initdata = ()=>{
   searchform.value = {
     protocolName: '',
   }
+  pagedata.value = {
+    total:0,
+    size:10,
+    current:1
+  }
 }
 const currentdata = ref({
 

ruoyi-ui-vue3/src/views/gateway/modbustcp/index.vue

@@ -239,6 +239,11 @@ const initdata = ()=>{
   searchform.value = {
     protocolName: '',
   }
+  pagedata.value = {
+    total:0,
+    size:10,
+    current:1
+  }
 }
 
 const currentdata = ref({