修改vue

vue/afvue/src/api/scinfo.js

@@ -17,4 +17,13 @@ export function Sclist(host){
         url: host+'/scdb',
         method: 'get'
     })
+}
+
+// 服务器编辑
+export function Scedit(host,param){
+    return axios({
+        url: host+'/scedit',
+        method: 'get',
+        params: param
+    })
 }

vue/afvue/src/router/index.js

@@ -24,6 +24,11 @@ const router = new VueRouter({
       name: 'setting',
       component: () => import('../views/Setting.vue')
     },
+    {
+      path: '/sedit',
+      name: 'settingedit',
+      component: () => import('../views/Setedit.vue')
+    },
     {
       path: '/about',
       name: 'about',

vue/afvue/src/views/Setedit.vue

@@ -0,0 +1,84 @@
+<template>
+    <div class="stedit">
+        <div class="stitem">
+            <label>服务器名称：</label>
+            <input type="text" placeholder="请输入服务器名称">
+        </div>
+        <div class="stitem">
+            <label>服务器IP：</label>
+            <input type="text" placeholder="请输入服务器IP">
+        </div>
+        <div class="stitem">
+            <label>服务器端口：</label>
+            <input type="text" placeholder="请输入服务器端口">
+        </div>
+        <div class="stitem">
+            <button>保存</button>
+        </div>
+        <div class="stitem">
+            <button>取消</button>
+        </div>
+    </div>
+    </template>
+    <style scoped>
+        .stedit {
+            width: 100%;
+            height: 100%;
+            padding: 10px;
+            background-color: #f5f5f5;
+            /* background-color: #eee9e9; */
+        }
+        .stitem label {
+            display: inline-block;
+            width: 100px;
+            text-align: right;
+        }
+        .stitem input {
+            width: 300px;
+            height: 36px;
+            line-height: 36px;
+            padding-left: 10px;
+        }
+        .stitem button {
+            width: 100px;
+            height: 36px;
+            line-height: 36px;
+            margin-right: 10px;
+        }
+        .stitem {
+            width: 100%;
+            height: 36px;
+            line-height: 36px;
+            margin-bottom: 10px;
+        }
+    </style>
+<script>
+import { Scedit } from '@/api/scinfo'
+
+export default {
+    data() {
+        return {
+            scid: 1,
+            scinfo:[]
+        }
+    },
+    mounted(e) {
+        console.log("evv",e)
+        th
+        this.getscdb()
+    },
+    methods: {
+        getscdb() {
+            let host ="http://localhost:9099"
+            Scedit(host,{
+                id: this.scid
+            }).then(res => {
+                if (res.code == 200) {
+                    this.serverlist = res.data
+                }
+            })
+        }
+    }
+}
+
+</script>

vue/afvue/src/views/Setting.vue

@@ -31,13 +31,12 @@
                         <th>服务器端口</th>
                         <th>操作</th>
                     </tr>
-                    <tr v-for="val in serverlist">
+                    <tr v-for="val in serverlist" :id="val.id">
                         <td>{{val.scname}}</td>
                         <td>{{val.addr}}</td>
                         <td>{{ val.port }}</td>
                         <td>
-                            <button>编辑</button>
-                            <button>删除</button>
+                            <a class="btn" :href="'sedit?id='+val.id">编辑</a>
                         </td>
                     </tr>