feat(): 服务器配置功能

src/api/vehicle/selectServerConfig.js

@@ -0,0 +1,16 @@
+import request from '@/utils/request'
+
+export function selectServerConfig() {
+  return request({
+    url: '/vehicle/server/config',
+    method: 'get'
+  })
+}
+
+export function editServerConfig(serverConfig) {
+  return request({
+    url: '/vehicle/server/config',
+    method: 'PUT',
+    data: serverConfig
+  })
+}

src/router/index.js

@@ -55,11 +55,23 @@ export const constantRoutes = [
     }]
   },
   {
-    path: '/form',
+    path: '/server',
     component: Layout,
     children: [
       {
-        path: 'index',
+        path: 'config',
+        name: '服务配置',
+        component: () => import('@/views/serverConfig/index'),
+        meta: { title: '服务配置', icon: 'example' }
+      }
+    ]
+  },
+  {
+    path: '/vehicle',
+    component: Layout,
+    children: [
+      {
+        path: 'instance',
         name: '数据模拟',
         component: () => import('@/views/vehicle/index'),
         meta: { title: '数据模拟', icon: 'form' }

src/views/serverConfig/index.vue

@@ -0,0 +1,106 @@
+<template>
+  <div style="margin: 10px">
+    <el-row :gutter="20">
+      <el-col :span="24">
+        <el-switch
+          v-model="isUpdate"
+          style="float: left; margin: 10px 20px;"
+          active-color="#13ce66"
+          inactive-color="#ff4949"
+          active-text="开启修改"
+          inactive-text="只查看"
+        />
+        <el-button v-if="isUpdate" style="float: left;" @click="editServerConfig">提交并刷新配置</el-button>
+      </el-col>
+      <el-col :xs="24" :md="12">
+        <el-card class="box-card">
+          <div slot="header" class="clearfix">
+            <span>负载均衡服务器配置</span>
+          </div>
+          <div class="text item">
+            <el-form ref="form" :model="serverConfig" label-width="120px">
+              <el-form-item label="负载服务地址">
+                <el-input v-model="serverConfig.host" :disabled="!isUpdate" />
+              </el-form-item>
+              <el-form-item label="负载服务端口">
+                <el-input v-model="serverConfig.port" :disabled="!isUpdate" />
+              </el-form-item>
+              <el-form-item label="负载服务API地址">
+                <el-input v-model="serverConfig.loadUrl" :disabled="!isUpdate" />
+              </el-form-item>
+            </el-form>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :xs="24" :md="12">
+        <el-card class="box-card">
+          <div slot="header" class="clearfix">
+            <span>默认MQTT配置</span>
+          </div>
+          <div class="text item">
+            <el-form ref="form" :model="serverConfig" label-width="120px">
+              <el-form-item label="MQTT默认地址">
+                <el-input v-model="serverConfig.defaultMqttAddr" :disabled="!isUpdate" />
+              </el-form-item>
+              <el-form-item label="MQTT默认主题">
+                <el-input v-model="serverConfig.defaultMqttTopic" :disabled="!isUpdate" />
+              </el-form-item>
+              <el-form-item label="MQTT交付级别">
+                <el-input v-model="serverConfig.defaultMqttQos" :disabled="!isUpdate" />
+              </el-form-item>
+            </el-form>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { editServerConfig, selectServerConfig } from '@/api/vehicle/selectServerConfig'
+
+export default {
+  name: 'ServerConfig',
+  data() {
+    return {
+      isUpdate: false,
+      serverConfig: {
+        host: null,
+        port: null,
+        loadUrl: null,
+        defaultMqttAddr: null,
+        defaultMqttTopic: null,
+        defaultMqttQos: null
+      }
+    }
+  },
+  created() {
+    this.getServerConfig()
+  },
+  methods: {
+    getServerConfig() {
+      selectServerConfig().then(response => {
+        this.serverConfig = response.data
+      })
+    },
+    editServerConfig() {
+      editServerConfig(this.serverConfig).then(response => {
+        this.$notify({
+          title: '操作提示',
+          message: response.msg,
+          type: response.code === 200 ? 'success' : 'error'
+        })
+        if (response.code === 200){
+          this.isUpdate = false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.el-col{
+  margin-top: 20px;
+}
+</style>