feat: 功能组件添加

新增vuex插件实现跨组件通信,调整国际化实现方式,调整路由参数,登录页面调整

nezha-fronted/config/index.js

@@ -1,4 +1,3 @@
-'use strict'
 // Template version: 1.3.1
 // see http://vuejs-templates.github.io/webpack for documentation.
 
@@ -11,7 +10,8 @@ module.exports = {
     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        target: 'http://localhost:8088/nz-admin', //设置调用接口域名和端口号别忘了加http
+        target: 'http://192.168.40.247:8080/nz-admin', //设置调用接口域名和端口号别忘了加http
+        // target: 'http://192.168.40.247:8080/nz-admin', //设置调用接口域名和端口号别忘了加http
         changeOrigin: true,
         pathRewrite: {
           '^/api': '/' //这里理解成用‘/api’代替target里面的地址，组件中我们调接口时直接用/api代替

nezha-fronted/package-lock.json

@@ -11037,11 +11037,6 @@
       "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.15.1.tgz",
       "integrity": "sha512-GBbz8qYCu0U2LNu4IcuFLZiuyninG4k26knvhL7GZG5Ncp4RR2VKDEH6g8gQ6I+UUBCvH2MBQVPSdxWe4DBkPw=="
     },
-    "vue-infinite-scroll": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/vue-infinite-scroll/-/vue-infinite-scroll-2.0.2.tgz",
-      "integrity": "sha512-n+YghR059YmciANGJh9SsNWRi1YZEBVlODtmnb/12zI+4R72QZSWd+EuZ5mW6auEo/yaJXgxzwsuhvALVnm73A=="
-    },
     "vue-loader": {
       "version": "13.7.3",
       "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-13.7.3.tgz",
@@ -11138,6 +11133,11 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
+    "vuex": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.2.tgz",
+      "integrity": "sha512-ha3jNLJqNhhrAemDXcmMJMKf1Zu4sybMPr9KxJIuOpVcsDQlTBYLLladav2U+g1AvdYDG5Gs0xBTb0M5pXXYFQ=="
+    },
     "watchpack": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",

nezha-fronted/package.json

@@ -14,8 +14,8 @@
     "element-ui": "^2.13.0",
     "vue": "^2.5.2",
     "vue-i18n": "^8.15.1",
-    "vue-infinite-scroll": "^2.0.2",
+    "vue-router": "^3.0.1",
-    "vue-router": "^3.0.1"
+    "vuex": "^3.1.2"
   },
   "devDependencies": {
     "autoprefixer": "^7.1.2",

nezha-fronted/src/components/common/header.vue

@@ -7,27 +7,33 @@
                     background-color="#ffffff"
                     unique-opened
             >
-                <el-menu-item index="1" @click="jumpTo('dashboard')"><div>
+                <el-menu-item index="1" @click="jumpTo('dashboard')">
-                    {{$t('overall.dashboard')}}</div></el-menu-item>
+                    <div>
+                        {{$t('overall.dashboard')}}
+                    </div>
+                </el-menu-item>
                 <el-submenu index="2">
-                    <template slot="title"><div @click="jumpTo('project')">{{$t('overall.project')}}</div></template>
+                    <template slot="title">
-                    <el-menu-item index="2-1">选项1</el-menu-item>
+                        <div @click="jumpTo('project')">{{$t('overall.project')}}</div>
-                    <el-menu-item index="2-2">选项2</el-menu-item>
+                    </template>
-                    <el-menu-item index="2-3">选项3</el-menu-item>
                 </el-submenu>
                 <el-submenu index="3">
-                    <template slot="title"><div @click="jumpTo('asset')">{{$t('overall.asset')}}</div></template>
+                    <template slot="title">
-                    <el-menu-item index="2-1">选项1</el-menu-item>
+                        <div @click="jumpTo('asset')">{{$t('overall.asset')}}</div>
-                    <el-menu-item index="2-2">选项2</el-menu-item>
+                    </template>
-                    <el-menu-item index="2-3">选项3</el-menu-item>
+                    <template v-for="(item, index) in assetData">
+                        <el-menu-item :index="index.toString()">
+                            <div @click="jumpTo('asset',item.id)">{{item.name}}</div>
+                        </el-menu-item>
+                    </template>
                 </el-submenu>
                 <el-submenu index="4">
-                    <template slot="title"><div @click="jumpTo('alarm')">{{$t('overall.asset')}}</div></template>
+                    <template slot="title">
-                    <el-menu-item index="2-1">选项1</el-menu-item>
+                        <div @click="jumpTo('alarm')">{{$t('overall.alarm')}}</div>
-                    <el-menu-item index="2-2">选项2</el-menu-item>
+                    </template>
-                    <el-menu-item index="2-3">选项3</el-menu-item>
                 </el-submenu>
             </el-menu>
+
         </div>
         <div class="header-right">
             <div class="header-user-con">
@@ -69,14 +75,16 @@ export default {
   data() {
     return {
       language: localStorage.getItem("language"),
+      assetData: []
     }
   },
   methods: {
-    jumpTo(data){
+    jumpTo(data,id) {
+      this.$store.state.assetSelect = id
       this.$router.push({
         path: "/" + data,
         query: {
-          t: +new Date() // 保证每次点击路由的query项都是不一样的，确保会重新刷新view
+          t: +new Date()
         }
       });
     },
@@ -84,6 +92,16 @@ export default {
       localStorage.setItem("language", lang);
       window.location.reload();
     },
+    getAssetData() {
+      this.$get('idc', this.pageObj).then(response => {
+        if (response.code == 200) {
+          this.assetData = response.data.list
+        }
+      })
+    },
+  },
+  mounted() {
+    this.getAssetData()
   }
 }
 </script>
@@ -92,6 +110,12 @@ export default {
 .el-submenu__title .el-submenu__icon-arrow {
     display: none;
 }
+.el-menu--horizontal>.el-menu-item.is-active{
+    border-bottom:0px
+}
+.el-menu--horizontal>.el-submenu.is-active .el-submenu__title{
+    border-bottom:0px
+}
 </style>
 
 <style scoped>
@@ -100,6 +124,7 @@ export default {
     width: 400px;
     float: left;
 }
+
 .header {
     position: relative;
     box-sizing: border-box;
@@ -110,29 +135,35 @@ export default {
     z-index: 500;
     box-shadow: 0px 20px 13px -19px #5E5E5E;
 }
+
 .header-right {
     float: right;
     padding-right: 5px;
 }
+
 .header-user-con {
     display: flex;
     height: 50px;
     align-items: center;
 }
+
 .user-avator {
     padding: 0 5px 3px 0;
     margin-left: 20px;
     line-height: 30px;
     cursor: pointer;
 }
+
 .user-avator:hover {
     border-radius: 2px;
     background: rgba(255, 255, 255, .3);
 }
+
 .user-avator span {
     font-size: 16px;
     margin: 0 5px;
 }
+
 .user-avator i.iconfont {
     color: #fff;
     font-size: 25px;
@@ -140,17 +171,20 @@ export default {
     display: inline-block;
     line-height: 30px;
 }
+
 .userout {
     display: flex;
     align-items: center;
     justify-content: space-between;
 }
+
 .userout > div {
     width: 33.3%;
     color: rgba(51, 137, 185, 1);
     cursor: pointer;
     text-align: center;
 }
+
 .SignOut {
     width: 100%;
     height: 30px;
@@ -161,9 +195,11 @@ export default {
     margin-top: 20px;
     cursor: pointer;
 }
+
 .SignOut:hover {
     opacity: .8;
 }
+
 .header-name-jiantou {
     position: static !important;
 }

nezha-fronted/src/components/common/home.vue

@@ -24,7 +24,7 @@ export default {
 
 .content-box {
     position: absolute;
-    left: 300px;
+    left: 370px;
     right: 30px;
     top: 60px;
     bottom: 0;

nezha-fronted/src/components/common/language/cn.js

@@ -3,87 +3,32 @@ const cn = {
   overall: {
     dashboard: '仪表盘',
     project: '工程',
-    asset:'资产'
+    asset: '资产',
+    alarm: '警告'
   },
   asset: {
-    tableTitle:[
+    tableTitle: {
-      {
+      id: 'ID',
-        label: 'ID',
+      assetType: '资产类型',
-        prop: 'ID',
+      Device: 'Device SN',
-        show: true,
+      IP: 'IP',
-      }, {
+      assetState: '资产状态',
-        label: '资产类型',
+      Module: 'Module',
-        prop: '资产类型',
+      Alarm: 'Alarm',
-        show: true,
+      dataCenter: '数据中心',
-      }, {
+      cabinet: '机柜',
-        label: 'Device SN',
+      model: '型号',
-        prop: 'Device SN',
+      manufacturer: '厂商',
-        show: true,
+      procurementDate: '采购日期',
-      }, {
+      warrantyDate: '保修截止期',
-        label: 'IP',
+      deviceDuty: '设备责任人',
-        prop: 'IP',
+    },
-        show: true,
+    tagTableTitle: {
-      }, {
+      projectName: '项目名称',
-        label: '资产状态',
+      moduleName: 'Module Name',
-        prop: '资产状态',
+      endPoint: 'EndPoint',
-        show: true,
+      alarm: 'Alarm',
-      }, {
-        label: 'Module',
-        prop: 'Module',
-        show: true,
-      }, {
-        label: 'Alarm',
-        prop: 'Alarm',
-        show: true,
-      }, {
-        label: '数据中心',
-        prop: '数据中心',
-        show: true,
-      }, {
-        label: '机柜',
-        prop: '机柜',
-        show: true,
-      }, {
-        label: '型号',
-        prop: '型号',
-        show: true,
-      }, {
-        label: '厂商',
-        prop: '厂商',
-        show: true,
-      }, {
-        label: '采购日期',
-        prop: '采购日期',
-        show: true,
-      }, {
-        label: '保修截止期',
-        prop: '保修截止期',
-        show: true,
-      }, {
-        label: '设备责任人',
-        prop: '设备责任人',
-        show: true,
-      }
-    ],
-    tagTableTitle: [
-      {
-        label: '项目名称',
-        prop: 'projectName',
-        show: true,
-      }, {
-        label: 'Module Name',
-        prop: 'moduleName',
-        show: true,
-      }, {
-        label: 'EndPoint',
-        prop: 'endPoint',
-        show: true,
-      }, {
-        label: 'Alarm',
-        prop: 'alarm',
-        show: true,
     },
-    ]
   },
   ...zhLocale
 }

nezha-fronted/src/components/common/language/en.js

@@ -6,84 +6,28 @@ const en = {
     asset:'asset'
   },
   asset:{
-    tableTitle:[
+    tableTitle: {
-      {
+      id: 'ID',
-        label: 'ID',
+      assetType: 'assetType',
-        prop: 'ID',
+      Device: 'Device SN',
-        show: true,
+      IP: 'IP',
-      }, {
+      assetState: 'assetState',
-        label: 'Asset Type',
+      Module: 'Module',
-        prop: '资产类型',
+      Alarm: 'Alarm',
-        show: true,
+      dataCenter: 'dataCenter',
-      }, {
+      cabinet: 'cabinet',
-        label: 'Device SN',
+      model: 'model',
-        prop: 'Device SN',
+      manufacturer: 'manufacturer',
-        show: true,
+      procurementDate: '采购日期',
-      }, {
+      warrantyDate: '保修截止期',
-        label: 'IP',
+      deviceDuty: '设备责任人',
-        prop: 'IP',
+    },
-        show: true,
+    tagTableTitle: {
-      }, {
+      projectName: '项目名称',
-        label: '资产状态',
+      moduleName: 'Module Name',
-        prop: '资产状态',
+      endPoint: 'EndPoint',
-        show: true,
+      alarm: 'Alarm',
-      }, {
-        label: 'Module',
-        prop: 'Module',
-        show: true,
-      }, {
-        label: 'Alarm',
-        prop: 'Alarm',
-        show: true,
-      }, {
-        label: '数据中心',
-        prop: '数据中心',
-        show: true,
-      }, {
-        label: '机柜',
-        prop: '机柜',
-        show: true,
-      }, {
-        label: '型号',
-        prop: '型号',
-        show: true,
-      }, {
-        label: '厂商',
-        prop: '厂商',
-        show: true,
-      }, {
-        label: '采购日期',
-        prop: '采购日期',
-        show: true,
-      }, {
-        label: '保修截止期',
-        prop: '保修截止期',
-        show: true,
-      }, {
-        label: '设备责任人',
-        prop: '设备责任人',
-        show: true,
-      }
-    ],
-    tagTableTitle: [
-      {
-        label: 'Project Name',
-        prop: 'projectName',
-        show: true,
-      }, {
-        label: 'Module Name',
-        prop: 'moduleName',
-        show: true,
-      }, {
-        label: 'EndPoint',
-        prop: 'endPoint',
-        show: true,
-      }, {
-        label: 'Alarm',
-        prop: 'alarm',
-        show: true,
     },
-    ]
   },
   ...enLocale
 }

nezha-fronted/src/components/common/login.vue

@@ -1,10 +1,24 @@
 <template>
     <div>
-        <div>登录</div>
+        <div class='login-right'>
-        <el-input v-model="loginData.username" placeholder="请输入内容"></el-input>
+            <div class="login-content">
-        <el-input v-model="loginData.password" placeholder="请输入内容"></el-input>
+                <div class="login-title">
+                    <h1>NeZha</h1>
+                    <div></div>
+                </div>
+                <div class="login-input" style="margin-top: 20px;">
+                    <input v-model="loginData.username" class="inputL" placeholder="username" ></input>
+                </div>
+
+                <div class="login-input">
+                    <input v-model="loginData.password" class="inputL" @keyup.enter="login" placeholder="password" ></input>
+                </div>
+                <div class="login-button">
                     <button @click="login">登录</button>
                 </div>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script>
@@ -20,11 +34,11 @@ export default {
   },
   methods: {
     login() {
-      this.$post('api/sys/login', (this.loginData)).then(res => {
+      this.$post('sys/login', (this.loginData)).then(res => {
         if (res.code == 200) {
           sessionStorage.setItem("token", res.data.token);
           this.$router.push({
-            path: "/asset",
+            path: "/dashboard",
             query: {
               t: +new Date()
             }
@@ -37,5 +51,76 @@ export default {
 </script>
 
 <style scoped>
+button {
+    width:180px;
+    padding-top: 10px;
+    padding-bottom: 12px;
+    background: #17558e !important;
+    border-radius: 5px;
+    font-size: 18px;
+    box-shadow: none;
+    outline: none;
+    border: none;
+    color: #fff;
+    display: block;
+    margin: 0 auto;
+    margin-top: 50px;
+}
 
+.login-right {
+    width: 400px;
+    height: 330px;
+    position: absolute;
+    top: 50%;
+    transform: translateY(-60%);
+    right: 42%;
+    background: #356b9d;
+    overflow: hidden;
+    padding: 2px;
+}
+.login-input {
+    height: 40px;
+    margin-bottom: 20px;
+    padding: 0 20px;
+}
+
+.login-input input {
+    outline: none;
+    border: none;
+    width: 100%;
+    height: 100%;
+    font-size: 14px;
+}
+
+.login-content {
+    background: #fff;
+    width: 100%;
+    height: 100%;
+}
+.login-content .login-title{
+    text-align: center;
+    padding-top: 20px;
+}
+.login-content .login-title h1{
+    color: rgb(23, 85, 142);
+    font-size: 26px;
+}
+.login-content .login-title div{
+    width: 260px;
+    margin: 0 auto;
+    margin-top: 25px;
+    margin-bottom: 20px;
+    height: 1px;
+    background: #507faa;
+}
+.login-content .login-content{
+    text-align: center;
+    padding-top: 20px;
+}
+.login-input{
+    border: 2px solid #507faa;
+    width: 70%;
+    margin-left: 10%;
+    border-radius: 5px;
+}
 </style>

nezha-fronted/src/components/common/sideBar.vue

@@ -1,11 +1,18 @@
 <template>
     <div class="sidebar">
-        <div class="cartTitle">
+        <div class="sidebar-title">
             <div>Project</div>
+            <div class="sidebar-info">
+                <div class="sidebar-info-header">ALL</div>
+                <div class="sidebar-info-footer">
+                    <el-checkbox-group v-model="checkList" size="small">
+                        <el-checkbox v-for="(item,key) in checkListData" :key="key" border :label=item.id>{{item.name}}
+                            <div class="checkbox-edit" @click.prevent="edit(item.id)">编辑</div>
+                        </el-checkbox>
+                    </el-checkbox-group>
+                </div>
+            </div>
         </div>
-<!--        <div v-for="{item} in arr" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="1">-->
-<!--            <div class="projectCard" :id="gett(item)"></div>-->
-<!--        </div>-->
     </div>
 </template>
 
@@ -14,43 +21,68 @@ export default {
   name: "SiderBar",
   data() {
     return {
-      // arr:[12,3,4,5,6,7,8,98,54]
+      checkList: [0],
+      checkListData: [],
+      pageObj: {
+        pageNo: 1,
+        pageSize: 20,
+        total: 0
+      },
+    }
+  },
+  computed:{
+    getData(){
+      return this.$store.state.assetSelect
+    }
+  },
+  watch:{
+    getData(newVal,oldVal){
+      this.checkList.splice(1,1,newVal)
     }
   },
   methods: {
-    // gett: function (index) {
+    edit(data) {
-    //   return "sdf" + index
+      console.log(data)
-    // },
+    },
-    // loadMore() {
+    getAssetData() {
-    //   this.busy = true
+      this.$get('idc', this.pageObj).then(response => {
-    //   setTimeout(() => {
+        if (response.code == 200) {
-    //     this.page++
+          this.checkListData = response.data.list
-    //   }, 1000)
+          console.log(this.checkListData)
-    //   this.arr.push('1')
+        }
-    // }
+      })
+    }
+  },
+  mounted() {
+    this.getAssetData()
+    function aa() {
+      console.log(this.$router.query)
+    }
   }
 }
 
 </script>
 
-<style scoped>
+<style>
-.cartTitle{
+.el-checkbox.is-bordered + .el-checkbox.is-bordered {
-    padding-left: 30px;
+    margin-left: 0px;
-    padding-top: 20px;
-}
-.projectCard{
-    margin-left: 30px;
     margin-top: 20px;
-    width: 80%;
-    height: 100px;
-    background-color: #ffffff;
-    border-radius: 8px;
-    border-top:10px solid #777777
 }
+
+.el-checkbox-group {
+    padding-top: 10px;
+}
+
+.el-checkbox {
+    width: 270px;
+}
+</style>
+
+<style scoped>
 .sidebar {
     display: block;
     position: absolute;
-    width: 300px;
+    width: 370px;
     left: 0;
     top: 60px;
     bottom: 0;
@@ -58,4 +90,39 @@ export default {
     overflow-y: scroll;
     background: rgba(242, 242, 242, 0.94);
 }
+
+.sidebar-title {
+    padding-left: 30px;
+    padding-top: 20px;
+}
+
+.sidebar-info {
+    margin-top: 20px;
+    border: 1px solid #acacac;
+    border-radius: 8px;
+    height: calc(90vh - 55px);
+    width: calc(100% - 30px);
+}
+
+.sidebar-info-header {
+    background: #acacac;
+    text-align: center;
+    line-height: 50px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+    height: 60px;
+    width: 100%;
+}
+
+.sidebar-info-footer {
+    padding-top: 15px;
+    padding-left: 15px;
+}
+
+.checkbox-edit {
+    position: absolute;
+    top: 8px;
+    left: 230px;
+
+}
 </style>

nezha-fronted/src/components/page/asset/asset.vue

@@ -239,8 +239,83 @@ export default {
   name: "asset",
   data() {
     return {
-      tableTitle: this.$t('asset.tableTitle'),
+      tableTitle: [
-      tagTableTitle: this.$t('asset.tagTableTitle'),
+        {
+          label: this.$t("asset.tableTitle.id"),
+          prop: 'ID',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.assetType"),
+          prop: '资产类型',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.Device"),
+          prop: 'Device SN',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.IP"),
+          prop: 'IP',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.assetState"),
+          prop: '资产状态',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.Module"),
+          prop: 'Module',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.Alarm"),
+          prop: 'Alarm',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.dataCenter"),
+          prop: '数据中心',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.cabinet"),
+          prop: '机柜',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.model"),
+          prop: '型号',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.manufacturer"),
+          prop: '厂商',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.procurementDate"),
+          prop: '采购日期',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.warrantyDate"),
+          prop: '保修截止期',
+          show: true,
+        }, {
+          label: this.$t("asset.tableTitle.deviceDuty"),
+          prop: '设备责任人',
+          show: true,
+        }],
+      tagTableTitle: [
+        {
+          label: this.$t("asset.tagTableTitle.projectName"),
+          prop: 'projectName',
+          show: true,
+        }, {
+          label: this.$t("asset.tagTableTitle.moduleName"),
+          prop: 'moduleName',
+          show: true,
+        }, {
+          label: this.$t("asset.tagTableTitle.endPoint"),
+          prop: 'endPoint',
+          show: true,
+        }, {
+          label: this.$t("asset.tagTableTitle.alarm"),
+          prop: 'alarm',
+          show: true,
+        },
+      ],
       tableData: [],
       tagTableData: [
         {
@@ -263,7 +338,7 @@ export default {
           projectName: '2016-05-02',
           moduleName: '王小虎',
           endPoint: '上海市普陀区金沙江路 1518 弄'
-        },
+        }
       ],
       pageObj: {
         pageNo: 1,
@@ -280,18 +355,11 @@ export default {
   },
   methods: {
     getListData() {
-      new Promise((resolve, reject) => {
+      this.$get('asset', this.pageObj).then(response => {
-        this.$get('api/asset',this.pageObj).
-        then(response => {
         if (response.code == 200) {
           this.tableData = response.data.list
-            console.log(this.tableData)
           this.pageObj.total = response.data.total
         }
-          resolve(response.data)
-        }).catch(err => {
-          reject(err.response)
-        })
       })
     },
     tagShow(t) {
@@ -353,7 +421,6 @@ export default {
     overflow-y: auto
 }
 
-
 .right-box__top-btn {
     border-radius: 0 0 9px 9px;
     float: right;

nezha-fronted/src/components/page/dashboard.vue

@@ -1,6 +1,8 @@
 <template>
     <div>
-        <iframe src="http://192.168.40.247:3000/" height="630" width="1200"></iframe>
+        <div>
+            <iframe src="http://192.168.40.247:3000/" class="dashboard"></iframe>
+        </div>
     </div>
 </template>
 
@@ -11,5 +13,8 @@ export default {
 </script>
 
 <style scoped>
-
+.dashboard{
+    height: calc(90vh);
+    width: calc(100%);
+}
 </style>

nezha-fronted/src/http.js

@@ -1,12 +1,14 @@
 import axios from 'axios'
 import qs from 'qs' //引入数据格式化
 
+axios.defaults.baseURL = 'http://192.168.40.247:8080/nz-admin' //远程服务器地址
+
 axios.interceptors.request.use(config => {
       config.headers = {
         "Content-Type": 'application/x-www-form-urlencoded',
-      }
+      };
       config.data = qs.stringify(config.data);
-      let token = sessionStorage.getItem('token')
+      let token = sessionStorage.getItem('token');
       if (token) {
         config.headers['Authorization'] = token //请求头token
       }

nezha-fronted/src/main.js

@@ -5,8 +5,12 @@ import ElementUI from 'element-ui';
 import i18n from './components/common/i18n'
 
 import Vue from 'vue'
+import Vuex from 'vuex'
+import store from './store/index';
 import App from './App'
 import router from './router'
+
+
 import axios from 'axios';
 import {post, get} from './http.js'
 
@@ -19,6 +23,7 @@ Vue.prototype.$get = get;
 
 Vue.config.productionTip = false
 Vue.use(ElementUI)
+Vue.use(Vuex)
 
 
 const clickoutside = {
@@ -40,6 +45,7 @@ const clickoutside = {
 
       }
     }
+
     // 给当前元素绑定个私有变量，方便在unbind中可以解除事件监听
     el.__vueClickOutside__ = documentHandler;
     document.addEventListener('click', documentHandler);
@@ -60,6 +66,7 @@ new Vue({
   el: '#app',
   router,
   i18n,
+  store,
   components: {App},
   template: '<App/>'
 })

nezha-fronted/src/store/index.js

@@ -0,0 +1,17 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+
+Vue.use(Vuex)
+const store = new Vuex.Store({
+  state: {
+    assetSelect:''
+  },
+  getters: {
+  },
+  mutations: {
+  },
+  actions: {
+  }
+});
+
+export default store;