添加monitor部分增删改查

src/api/tool.js

@@ -46,4 +46,24 @@ export const GetFileInfoByMd5Service = (Data) => {
             'token': Data.token, 
         }
     })
+}
+
+export const GetMonitorDeviceInfoService = (Data) => {
+    return request.get('/tool/get_monitor_list')
+}
+
+export const UpdateMonitorDeviceInfoService = (Data) => {
+    return request.post('/tool/update_monitor', Data,{
+        headers: {
+            'token': Data.token, // 闂佽绻愭蹇涘箯閿燂拷 token 闂備礁鎼ú锔锯偓绗涘啰鏆﹂柛娆忣槺閳绘棃鏌ｉ幋鐏活亝绂嶉崼鏇熺厽闁靛ǹ鍎遍褔鏌熼煬鎻掆偓婵嬪箖瑜忔禒锔炬喆閿濆懍澹曢梺璺ㄥ櫐閹凤拷  
+        }  
+    })
+}
+
+export const DelMonitorDeviceInfoService = (Data) => {
+    return request.post('/tool/del_monitor', Data,{
+        headers: {
+            'token': Data.token, // 闂佽绻愭蹇涘箯閿燂拷 token 闂備礁鎼ú锔锯偓绗涘啰鏆﹂柛娆忣槺閳绘棃鏌ｉ幋鐏活亝绂嶉崼鏇熺厽闁靛ǹ鍎遍褔鏌熼煬鎻掆偓婵嬪箖瑜忔禒锔炬喆閿濆懍澹曢梺璺ㄥ櫐閹凤拷  
+        }  
+    })
 }

src/router/index.js

@@ -17,6 +17,7 @@ import Shell from "@/views/ShellList.vue"
 import callback from "@/views/callback.vue";
 import projectSelect from "@/views/project-select.vue";
 
+
 const routes = [
     {
         path: '/login',

src/views/ShellList.vue

@@ -7,6 +7,9 @@ import { getConfigShellListService } from "@/api/shell.js";
 import { addConfigShellService } from "@/api/shell.js";
 import { deleteConfigShellService } from "@/api/shell.js";
 import { updateConfigShellService } from "@/api/shell.js";
+import { GetMonitorDeviceInfoService } from "@/api/tool.js";
+import { UpdateMonitorDeviceInfoService } from "@/api/tool.js";
+import { DelMonitorDeviceInfoService } from "@/api/tool.js";
 
 export default {
   data() {
@@ -15,6 +18,7 @@ export default {
       tableData: [],
       loading: false,
       search_id: 2002,
+      dialogVisible: false,
       ConfigShellUpdateForm: {},
       keyword: "",
       updateDialogVisible: false,
@@ -35,6 +39,10 @@ export default {
         { label: "阿里云服务器", value: "aliyun_vp_server" },
         { label:"azure服务器", value:"azure_vp_server" }
       ],
+      monitor_list: [],
+      monitor_add_update_visible: false,
+      monitor_update_add: {},
+
 
       role: "",
       tokenData: {
@@ -164,6 +172,10 @@ export default {
       this.ConfigShellUpdateForm = cf;
       this.updateDialogVisible = true;
     },
+    showMonitorList() {
+      this.dialogVisible = true;
+      this.getMonitorDeviceList();
+    },
     async createAgain(index) {
       let cf = this.ConfigFileCurrentPageData[index];
       this.addForm.shell_name = cf.ShellName;
@@ -209,6 +221,73 @@ export default {
     toVideoList() {
       router.push("/videoList");
     },
+    async getMonitorDeviceList(){
+      try {
+        let req = {
+          token: this.tokenData.token,
+          type: "all",
+        };
+        let result = await GetMonitorDeviceInfoService(req);
+        if (result.code === 0) {
+          this.monitor_list = result.data;
+          console.log("monitor_list:", this.monitor_list);
+          this.dialogVisible = true; // 打开设备监控对话框
+        } else {
+          ElMessage.error("获取设备列表失败");
+        }
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    updateMonitorShow(index) {
+      this.monitor_add_update_visible = true;
+      this.monitor_update_add = { ...this.monitor_list[index] }; // 深拷贝，避免直接修改原数据
+    },
+    //确定添加或修改设备
+    async addUpdateMonitor(){
+      let req = {
+        "token": this.tokenData.token,
+        "devices": [this.monitor_update_add],
+      };
+      req.devices[0].expire =parseInt(req.devices[0].expire);
+      try{
+        let result = await UpdateMonitorDeviceInfoService(req);
+        if (result.code === 0) {
+          ElMessage.success("设备信息更新成功");
+          this.monitor_add_update_visible = false;
+        } else {
+          ElMessage.error("设备信息更新失败");
+        }
+        
+      }catch (e) {
+        console.log(e);
+      }
+    },
+
+    async DelMonitor(index) {
+      let isDelete = confirm("是否删除?");
+      if (!isDelete) {
+        return;
+      }
+      let req = {
+        token: this.tokenData.token,
+        devices: [this.monitor_list[index]],
+      };
+      try {
+ 
+        let result = await DelMonitorDeviceInfoService(req);
+        if (result.code === 0) {
+          ElMessage.success("设备删除成功");
+          this.getMonitorDeviceList();
+        } else {
+          ElMessage.error("设备删除失败");
+        }
+      } catch (e) {
+        console.log(e);
+      }
+    },
+
+
     // 修改条纹颜色
     tableRowClassName({ row, rowIndex }) {
       switch (row.Status) {
@@ -334,6 +413,14 @@ export default {
                   >创建命令</el-button
                 >
               </el-form-item>
+              <el-form-item>
+                <el-button
+                  class="el-button--danger"
+                  type="primary"
+                  @click="getMonitorDeviceList()"
+                  >设备监控</el-button
+                >
+              </el-form-item>
             </el-form>
           </el-form>
 
@@ -394,6 +481,105 @@ export default {
               </span>
             </template>
           </el-dialog>
+          
+
+          <el-dialog
+            v-model="monitor_add_update_visible"
+            title="编辑监控"
+            width="50%"
+            @close="handleClose">
+
+            <el-form
+              ref="monitorUpdateFormRef"
+              :model="monitor_update_add"
+              :rules="UserUpdateFormRules"
+              label-width="70px"  
+              >
+            
+              <el-row>
+                <el-form-item label="设备" prop="id">
+                  <el-input
+                    v-model="monitor_update_add.id"
+                  ></el-input>
+                  </el-form-item>
+             </el-row>
+             <el-row>
+                <el-form-item label="状态" prop="status">
+                  <el-select v-model="monitor_update_add.status">
+                    <el-option label="在线" value="1"></el-option>
+                    <el-option label="离线" value="0"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-row>
+              <el-row>
+                <el-form-item label="过期时间" prop="expire">
+                  <el-input 
+                    v-model="monitor_update_add.expire"
+                    oninput="this.value = this.value.replace(/[^0-9]/g, '')"
+                  ></el-input>
+                </el-form-item>
+              </el-row>
+            </el-form>
+            <!-- 底部区域 -->
+             <template #footer>
+ 
+              <span class="dialog-footer">
+                <el-button @click="monitor_add_update_visible = false"
+                  >取消</el-button
+                >
+                <el-button type="primary" @click="addUpdateMonitor()"
+                  >确定</el-button
+                >
+              </span>
+              </template> 
+          </el-dialog>
+
+
+          <el-dialog
+            v-model="dialogVisible"
+            title="设备状态监控"
+            width="50%"
+            @close="handleClose"
+          >
+          <el-button type="primary" @click="monitor_add_update_visible = true">添加</el-button>
+              <el-table
+                :data="monitor_list"
+                stripe
+                width="90%"
+                fit
+              >
+                <el-table-column prop="id" label="设备" width="150"></el-table-column>
+                <el-table-column prop="status" label="状态" width="150">
+                  <template #default="scope">
+                    <el-tag
+                      :type="scope.row.status === '1' ? 'success' : 'danger'"
+                      >{{ scope.row.status === "1" ? '在线' : '离线' }}</el-tag
+                    >
+                  </template>
+                </el-table-column>
+                <el-table-column prop="expire" label="过期时间" width="150">
+                </el-table-column>  
+                            <el-table-column label="操作" width="270">
+              <template #default="scope">
+                <el-button
+                  type="primary"
+                  size="mini"
+                  @click.prevent="updateMonitorShow(scope.$index)"
+                  >编辑</el-button
+                >
+                <el-button
+                  type="primary"
+                  size="mini"
+                  @click.prevent="DelMonitor(scope.$index)"
+                  >删除</el-button
+                >
+              </template>
+            </el-table-column>
+              </el-table>
+            <template #footer>
+              <el-button @click="dialogVisible = false">取消</el-button>
+            </template>
+          </el-dialog>
 
           <!-- 表格  :row-style="this.tableRowClassName"-->
           <el-table :data="ConfigFileCurrentPageData" width="100%" v-loading="loading">