1

public/config.js

@@ -2,4 +2,4 @@ var PLATFROM_CONFIG = {};
 PLATFROM_CONFIG.baseUrl = "http://106.14.243.117:9111" // http请求地址
 PLATFROM_CONFIG.appSecret = "9inu7zpllz1folzsljm498dcpi0lsog1" //appSecret
 PLATFROM_CONFIG.appId = "q7kdjmmaf0kerwpf" //appid
-PLATFROM_CONFIG.baseURLCA = 'http://192.168.3.74:8088'
+PLATFROM_CONFIG.baseURLCA = 'http://192.168.3.74:8888'

src/api/dataIntegration.js

@@ -19,3 +19,14 @@ export function GeneralDataReception(params) {
     data: params
   })
 }
+
+export function Query(params) {
+  return request({
+    url: '/openApi/query',
+    method: 'post',
+    headers: {
+      'content-type': 'application/json'
+    },
+    data: params
+  })
+}

src/utils/request.js

@@ -53,7 +53,7 @@ service.interceptors.response.use(
     const res = response.data
 
     // if the custom code is not 20000, it is judged as an error.
-    if (res.code !== 0) {
+    if (res.code !== '0') {
       Message({
         message: res.message || 'Error',
         type: 'error',

src/utils/validate.js

@@ -264,3 +264,20 @@ export function lengthValidator(rule, value, callback) {
     callback()
   }
 }
+/**
+ * 是否合法IP地址
+ * @param value
+ * @param callback
+ */
+ export function validateIP(rule, value, callback) {
+  if (value === '' || typeof value === 'undefined' || value == null) {
+    callback(new Error('请输入正确的IP地址'))
+  } else {
+    const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
+    if ((!reg.test(value)) && value !== '') {
+      callback(new Error('请输入正确的IP地址'))
+    } else {
+      callback()
+    }
+  }
+}

src/views/systemSettings/views/machineManagement/machineHome.vue

@@ -15,17 +15,22 @@
           <div class="manageTitle">机器维护</div>
           <div class="status1"><span class="icon"></span>物理机</div>
           <div class="status2"><span class="icon"></span>虚拟机</div>
-          <div class="status3"><span class="icon"></span>docker</div>
+          <div class="status3"><span class="icon"></span>Docker</div>
         </div>
         <div class="addBtn">
-          <el-button class="button-white" size="small" @click="showAddDialog()">新增</el-button>
+          <el-button class="button-white" size="small" @click="showAddDialog()"
+            >新增</el-button
+          >
         </div>
       </div>
       <div class="protocol-content">
         <el-row :gutter="24">
           <el-col v-for="item in dataList" :key="item.deployNodeID" :span="4">
             <div class="grid-content">
-              <div :class="item.deployNodeType ? 'success' : 'error'" class="grid-content-bg"></div>
+              <div
+                :class="{ 'success': item.nodeType=='物理机', 'error': item.nodeType=='虚拟机', 'info': item.nodeType=='Docker' }"
+                class="grid-content-bg"
+              ></div>
               <div class="grid-content-hand flex">
                 <div class="title flex-wrap">
                   <div class="name">{{ item.deployNodeName }}</div>
@@ -35,8 +40,10 @@
               </div>
               <div class="grid-content-hand flex">
                 <div class="cardContent">
-                  <div class="IPadress">服务地址信息：10.72.3.66</div>
-                  <div class="type">类型：物理机</div>
+                  <div class="IPadress">
+                    服务地址信息：{{ item.serviceURL }}
+                  </div>
+                  <div class="type">类型：{{ item.nodeType }}</div>
                 </div>
               </div>
             </div>
@@ -48,29 +55,60 @@
         <div class="airportInfoDialog dialog-public-background">
           <div class="title">{{ editDialogTitle }}</div>
           <div class="content">
-            <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="130px" class="demo-ruleForm">
-              <el-form-item label="机器" prop="deployNodeName">
-                <el-input v-model="ruleForm.deployNodeName" size="medium" placeholder="请输入机器名称" />
+            <el-form
+              ref="ruleForm"
+              :model="ruleForm"
+              :rules="rules"
+              label-width="130px"
+              class="demo-ruleForm"
+            >
+              <el-form-item label="机器名称" prop="deployNodeName">
+                <el-input
+                  v-model="ruleForm.deployNodeName"
+                  size="small"
+                  placeholder="请输入机器名称"
+                />
               </el-form-item>
               <el-form-item label="机器描述">
-                <el-input v-model="ruleForm.deployNodeDescribe" size="medium" type="textarea" :rows="2" placeholder="请输入描述" />
+                <el-input
+                  v-model="ruleForm.deployNodeDescribe"
+                  size="small"
+                  type="textarea"
+                  :rows="2"
+                  placeholder="请输入描述"
+                />
               </el-form-item>
-              <el-form-item label="服务器地址信息" prop="serviceURL">
-                <el-input v-model="ruleForm.serviceURL" size="medium" placeholder="请输入服务器地址信息" />
-
+              <el-form-item label="服务地址" prop="serviceURL">
+                <el-input
+                  v-model="ruleForm.serviceURL"
+                  size="small"
+                  placeholder="请输入服务器地址信息"
+                />
               </el-form-item>
-              <el-form-item label="机器类型" prop="deployNodeType">
-                <el-select v-model="ruleForm.deployNodeType" size="medium" placeholder="请选择机器类型">
-                  <el-option label="物理机" value="1"></el-option>
-                  <el-option label="虚拟机" value="2"></el-option>
-                  <el-option label="docker" value="3"></el-option>
+              <el-form-item label="机器类型" prop="nodeType">
+                <el-select
+                  v-model="ruleForm.nodeType"
+                  size="small"
+                  placeholder="请选择机器类型"
+                >
+                  <el-option label="物理机" value="物理机"></el-option>
+                  <el-option label="虚拟机" value="虚拟机"></el-option>
+                  <el-option label="Docker" value="Docker"></el-option>
                 </el-select>
               </el-form-item>
             </el-form>
           </div>
           <div class="foot center t30">
-            <el-button size="medium" type="primary" class="r25 r26" @click="submitClickHandler()">提交</el-button>
-            <el-button size="medium" class="r26" @click="resetForm('ruleForm')">取消</el-button>
+            <el-button
+              size="medium"
+              type="primary"
+              class="r25 r26"
+              @click="submitClickHandler()"
+              >提交</el-button
+            >
+            <el-button size="medium" class="r26" @click="resetForm('ruleForm')"
+              >取消</el-button
+            >
           </div>
         </div>
       </Dialog>
@@ -79,13 +117,22 @@
         <div class="airportInfoDialog">
           <div class="del-title">删除协议</div>
           <div class="content er">
-            <div class="log">
-              是否确认删除{{ rmObj.protocolName }}？
-            </div>
+            <div class="log">你是否确认删除{{ rmObj.deployNodeName }}？</div>
           </div>
           <div class="DelFoot right t30">
-            <el-button size="medium" class="r25 r26" type="danger" @click="removeSubmit()">删除</el-button>
-            <el-button size="medium" class="r26" @click="removeDialogVisible = false">取消</el-button>
+            <el-button
+              size="medium"
+              class="r25 r26"
+              type="danger"
+              @click="removeSubmit()"
+              >删除</el-button
+            >
+            <el-button
+              size="medium"
+              class="r26"
+              @click="removeDialogVisible = false"
+              >取消</el-button
+            >
           </div>
         </div>
       </Dialog>
@@ -94,116 +141,152 @@
 </template>
 
 <script>
-import Dialog from '@/layout/components/Dialog/index.vue'
-import { GeneralDataReception } from '@/api/dataIntegration'
+import Dialog from "@/layout/components/Dialog/index.vue";
+import { GeneralDataReception,Query } from "@/api/dataIntegration";
+import { validateIP } from "@/utils/validate";
 
 export default {
-  name: 'ProtocolHome',
+  name: "ProtocolHome",
   components: { Dialog },
-  data () {
+  data() {
     return {
       dataList: [],
       editDialogVisible: false,
       removeDialogVisible: false,
       rmObj: {},
-      editDialogTitle: '新增机器',
+      editDialogTitle: "新增机器",
       ruleForm: {
-        // 协议信息表单
-        deployNodeID: null,
-        deployNodeName: '',
-        deployNodeDescribe: '',
-        serviceURL: '',
-        deployNodeType: ''
+        // 机器信息表单
+        deployNodeName: "",
+        deployNodeDescribe: "",
+        serviceURL: "",
+        deployNodeType: "",
       },
       rules: {
-        // 协议信息表单验证
-        deployNodeName: [{ required: true, message: '请输入机器名称', trigger: 'blur' }],
-        serviceURL: [{ required: true, message: '请输入服务器地址信息', trigger: 'blur' }],
-        deployNodeType: [{ required: true, message: '请选择机器类型', trigger: 'blur' }]
-      }
-    }
+        // 机器信息表单验证
+        deployNodeName: [
+          { required: true, message: "请输入机器名称", trigger: "blur" },
+        ],
+        serviceURL: [
+          {
+            required: true,
+            message: "请输入正确的IP地址",
+            validator: this.validateIP,
+            trigger: "blur",
+          },
+        ],
+        deployNodeType: [
+          { required: true, message: "请选择机器类型", trigger: "blur" },
+        ],
+      },
+    };
   },
-  created () {
-    for (let index = 0; index < 20; index++) {
-      this.dataList.push({
-        deployNodeID: index,
-        deployNodeType: index % 2 == 0 ? true : false,
-        deployNodeName: '主采集服务器-' + (Math.floor(Math.random() * 10) + 1)
-      })
-    }
+  created() {
+    this.getList()
   },
   methods: {
+    async getList() {
+      try {
+        const res = await Query({
+          id: 2,
+          dataContent: []
+        });
+        if (res.code === "0") {
+            this.dataList = res.returnData
+        } else {
+          this.$message.error(res.message ?? "失败");
+        }
+      } catch (error) {
+        console.log("错误", error);
+      }
+    },
     // 新增-弹框
-    showAddDialog () {
-      this.editDialogTitle = '新增机器'
-      this.editDialogVisible = true
+    showAddDialog() {
+      this.editDialogTitle = "新增机器";
+      this.editDialogVisible = true;
     },
     // 编辑-弹框
-    showEditDialog (item) {
-      this.editDialogTitle = '编辑机器'
-      this.ruleForm = item
-      this.editDialogVisible = true
+    showEditDialog(item) {
+      this.editDialogTitle = "编辑机器";
+      this.ruleForm = JSON.parse(JSON.stringify(item));
+      this.editDialogVisible = true;
     },
     // 新增/编辑-确认
-    submitClickHandler () {
-      this.$refs['ruleForm'].validate(valid => {
+    submitClickHandler() {
+      this.$refs["ruleForm"].validate((valid) => {
         if (valid) {
-          if (this.ruleForm.protocolId) {
-            this.addSubmit()
+          if (!this.ruleForm.deployNodeID) {
+            this.addSubmit();
           } else {
-            this.editSubmit()
+            this.editSubmit();
           }
-          this.resetForm('ruleForm')
+          this.resetForm("ruleForm");
         }
-      })
+      });
     },
     // 重置
-    resetForm (formName) {
-      this.$refs[formName].resetFields()
-      this.editDialogVisible = false
+    resetForm(formName) {
+      this.ruleForm = {}
+      this.$refs[formName].resetFields();
+      this.editDialogVisible = false;
     },
     // 删除-弹框
-    showRemoveDialog (item) {
-      this.rmObj = item
-      this.removeDialogVisible = true
+    showRemoveDialog(item) {
+      this.rmObj = item;
+      this.removeDialogVisible = true;
     },
     // 确认删除
-    removeSubmit () {
-      this.removeDialogVisible = false
-      this.$message.success('删除成功')
+    async removeSubmit() {
+      this.ruleForm["operate"] = "3";
+      try {
+        const res = await GeneralDataReception({
+          serviceId: "2",
+          dataContent:  JSON.stringify(this.ruleForm),
+        });
+        if (res.code === "0") {
+          this.removeDialogVisible = false;
+          this.$message.success("删除成功");
+        } else {
+          this.$message.error(res.message ?? "失败");
+        }
+      } catch (error) {
+        console.log("错误", error);
+      }
     },
-    async addSubmit () {
+    async addSubmit() {
+      this.ruleForm["operate"] = "1";
       try {
         const res = await GeneralDataReception({
-          serviceId: '1',
-          dataContent: JSON.stringify(this.ruleForm)
-        })
-        if (res.code === 0) {
-          this.$message.success(res.message ?? '成功')
+          serviceId: "2",
+          dataContent: JSON.stringify(this.ruleForm),
+        });
+        if (res.code === "0") {
+          this.$message.success(res.message ?? "成功");
         } else {
-          this.$message.error(res.message ?? '失败')
+          this.$message.error(res.message ?? "失败");
         }
       } catch (error) {
-        console.log('错误', error)
+        console.log("错误", error);
       }
     },
-    async editSubmit () {
+    async editSubmit() {
+      this.ruleForm["operate"] = "2";
       try {
         const res = await GeneralDataReception({
-          serviceId: '1',
-          dataContent: JSON.stringify(this.ruleForm)
-        })
+          serviceId: "2",
+          dataContent: JSON.stringify(this.ruleForm),
+        });
         if (res.code === 0) {
-          this.$message.success(res.message ?? '成功')
+          this.$message.success(res.message ?? "成功");
         } else {
-          this.$message.error(res.message ?? '失败')
+          this.$message.error(res.message ?? "失败");
         }
       } catch (error) {
-        console.log('错误', error)
+        console.log("错误", error);
       }
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
@@ -255,7 +338,7 @@ export default {
         .status3 {
           font-size: 14px;
           .icon {
-            background: #73D970;
+            background: #73d970;
           }
         }
       }
@@ -310,17 +393,17 @@ export default {
             background-size: 100% 100%;
           }
         }
-        .cardContent{
+        .cardContent {
           margin-top: 30px;
           text-align: left;
           width: 100%;
-          .IPadress{
+          .IPadress {
             font-size: 14px;
             font-weight: normal;
             color: #101116;
             width: 100%;
           }
-          .type{
+          .type {
             margin-top: 14px;
             font-size: 14px;
             font-weight: normal;
@@ -339,6 +422,9 @@ export default {
         .error {
           background-color: #f4c154;
         }
+        .info {
+          background-color: #73d970;
+        }
       }
     }
   }

src/views/systemSettings/views/protocolManagement/protocolHome.vue

@@ -13,7 +13,7 @@
       <div class="protocol-header flex">
         <div class="status flex-wrap">
           <div class="manageTitle">协议管理</div>
-          <div class="status1"><span class="icon"></span>物流</div>
+          <div class="status1"><span class="icon"></span>内置</div>
           <div class="status2"><span class="icon"></span>扩展</div>
         </div>
         <div class="addBtn">
@@ -24,7 +24,7 @@
         <el-row :gutter="24">
           <el-col v-for="item in dataList" :key="item.protocolId" :span="4">
             <div class="grid-content">
-              <div :class="item.protocolStatus ? 'success' : 'error'" class="grid-content-bg"></div>
+              <div :class="item.protocolStatus=='1' ? 'success' : 'error'" class="grid-content-bg"></div>
               <div class="grid-content-hand flex">
                 <div class="title flex-wrap">
                   <div class="name">{{ item.protocolName }}</div>
@@ -45,6 +45,16 @@
               <el-form-item label="协议名称" prop="protocolName">
                 <el-input v-model="ruleForm.protocolName" size="medium" placeholder="请输入协议名称（必填）" />
               </el-form-item>
+              <el-form-item label="协议类型" prop="nodeType">
+                <el-select
+                  v-model="ruleForm.nodeType"
+                  size="small"
+                  placeholder="请选择协议类型"
+                >
+                  <el-option label="内置" value="1"></el-option>
+                  <el-option label="扩展" value="2"></el-option>
+                </el-select>
+              </el-form-item>
               <el-form-item label="类名" prop="className">
                 <el-input v-model="ruleForm.className" size="medium" type="textarea" :rows="2" placeholder="请输入类名（必填）" />
               </el-form-item>
@@ -100,7 +110,6 @@ export default {
       editDialogTitle: '新增协议',
       ruleForm: {
         // 协议信息表单
-        protocolId: null,
         protocolName: '',
         className: '',
         rmethodName: '',
@@ -117,15 +126,24 @@ export default {
     }
   },
   created () {
-    for (let index = 0; index < 20; index++) {
-      this.dataList.push({
-        protocolId: index,
-        protocolStatus: index % 2 == 0 ? true : false,
-        protocolName: 'IMBQ-' + (Math.floor(Math.random() * 10) + 1)
-      })
-    }
+    this.getList()
   },
   methods: {
+    async getList() {
+      try {
+        const res = await Query({
+          id: 1,
+          dataContent: []
+        });
+        if (res.code === 0) {
+            console.log(res)
+        } else {
+          this.$message.error(res.message ?? "失败");
+        }
+      } catch (error) {
+        console.log("错误", error);
+      }
+    },
     // 新增-弹框
     showAddDialog () {
       this.editDialogTitle = '新增协议'
@@ -161,11 +179,25 @@ export default {
       this.removeDialogVisible = true
     },
     // 确认删除
-    removeSubmit () {
-      this.removeDialogVisible = false
-      this.$message.success('删除成功')
+    async removeSubmit () {
+      this.ruleForm["operate"] = "3";
+      try {
+        const res = await GeneralDataReception({
+          serviceId: "1",
+          dataContent: JSON.stringify(this.ruleForm),
+        });
+        if (res.code === 0) {
+          this.removeDialogVisible = false;
+          this.$message.success("删除成功");
+        } else {
+          this.$message.error(res.message ?? "失败");
+        }
+      } catch (error) {
+        console.log("错误", error);
+      }
     },
     async addSubmit () {
+      this.ruleForm["operate"] = "1";
       try {
         const res = await GeneralDataReception({
           serviceId: '1',
@@ -181,6 +213,7 @@ export default {
       }
     },
     async editSubmit () {
+      this.ruleForm["operate"] = "2";
       try {
         const res = await GeneralDataReception({
           serviceId: '1',