From 90855e258e2b1dbdcb1052e9af673bb55c7f3892 Mon Sep 17 00:00:00 2001 From: wanghaoyu <825151728@qq.com> Date: Thu, 5 Dec 2019 16:48:23 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8A=9F=E8=83=BD=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20=E6=96=B0=E5=A2=9Evuex=E6=8F=92=E4=BB=B6?= =?UTF-8?q?=E5=AE=9E=E7=8E=B0=E8=B7=A8=E7=BB=84=E4=BB=B6=E9=80=9A=E4=BF=A1?= =?UTF-8?q?,=E8=B0=83=E6=95=B4=E5=9B=BD=E9=99=85=E5=8C=96=E5=AE=9E?= =?UTF-8?q?=E7=8E=B0=E6=96=B9=E5=BC=8F,=E8=B0=83=E6=95=B4=E8=B7=AF?= =?UTF-8?q?=E7=94=B1=E5=8F=82=E6=95=B0,=E7=99=BB=E5=BD=95=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- nezha-fronted/config/index.js | 4 +- nezha-fronted/package-lock.json | 10 +- nezha-fronted/package.json | 4 +- .../src/components/common/header.vue | 102 +++++++++----- nezha-fronted/src/components/common/home.vue | 2 +- .../src/components/common/language/cn.js | 111 ++++----------- .../src/components/common/language/en.js | 100 +++----------- nezha-fronted/src/components/common/login.vue | 97 ++++++++++++- .../src/components/common/sideBar.vue | 127 +++++++++++++----- .../src/components/page/asset/asset.vue | 107 ++++++++++++--- .../src/components/page/dashboard.vue | 9 +- nezha-fronted/src/http.js | 6 +- nezha-fronted/src/main.js | 11 +- nezha-fronted/src/store/index.js | 17 +++ 14 files changed, 441 insertions(+), 266 deletions(-) create mode 100644 nezha-fronted/src/store/index.js diff --git a/nezha-fronted/config/index.js b/nezha-fronted/config/index.js index f0bc0d882..e5f6ad870 100644 --- a/nezha-fronted/config/index.js +++ b/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代替 diff --git a/nezha-fronted/package-lock.json b/nezha-fronted/package-lock.json index 330b94fa6..7a1459fbe 100644 --- a/nezha-fronted/package-lock.json +++ b/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", diff --git a/nezha-fronted/package.json b/nezha-fronted/package.json index 694d3a655..2697ca5ba 100644 --- a/nezha-fronted/package.json +++ b/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", diff --git a/nezha-fronted/src/components/common/header.vue b/nezha-fronted/src/components/common/header.vue index 2227cec14..c840b9da4 100644 --- a/nezha-fronted/src/components/common/header.vue +++ b/nezha-fronted/src/components/common/header.vue @@ -7,27 +7,33 @@ background-color="#ffffff" unique-opened > -
- {{$t('overall.dashboard')}}
 + +
+ {{$t('overall.dashboard')}} +
+ - - 选项1 - 选项2 - 选项3 + - - 选项1 - 选项2 - 选项3 + + - - 选项1 - 选项2 - 选项3 + +
@@ -43,10 +49,10 @@

English

-
+

简体

-
+

русский

@@ -66,17 +72,19 @@ \ No newline at end of file diff --git a/nezha-fronted/src/components/common/home.vue b/nezha-fronted/src/components/common/home.vue index 9ee523150..ee01d09f7 100644 --- a/nezha-fronted/src/components/common/home.vue +++ b/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; diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js index 9f6617b5e..c6f786d38 100644 --- a/nezha-fronted/src/components/common/language/cn.js +++ b/nezha-fronted/src/components/common/language/cn.js @@ -1,89 +1,34 @@ import zhLocale from 'element-ui/lib/locale/lang/zh-CN' //引入element语言包 const cn = { - overall:{ - dashboard:'仪表盘', - project:'工程', - asset:'资产' + overall: { + dashboard: '仪表盘', + project: '工程', + asset: '资产', + alarm: '警告' }, - asset:{ - tableTitle:[ - { - label: 'ID', - prop: 'ID', - show: true, - }, { - label: '资产类型', - prop: '资产类型', - show: true, - }, { - label: 'Device SN', - prop: 'Device SN', - show: true, - }, { - label: 'IP', - prop: 'IP', - show: true, - }, { - label: '资产状态', - prop: '资产状态', - show: true, - }, { - 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, - }, - ] + asset: { + tableTitle: { + id: 'ID', + assetType: '资产类型', + Device: 'Device SN', + IP: 'IP', + assetState: '资产状态', + Module: 'Module', + Alarm: 'Alarm', + dataCenter: '数据中心', + cabinet: '机柜', + model: '型号', + manufacturer: '厂商', + procurementDate: '采购日期', + warrantyDate: '保修截止期', + deviceDuty: '设备责任人', + }, + tagTableTitle: { + projectName: '项目名称', + moduleName: 'Module Name', + endPoint: 'EndPoint', + alarm: 'Alarm', + }, }, ...zhLocale } diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js index 2f5b02be6..a4f1c33f6 100644 --- a/nezha-fronted/src/components/common/language/en.js +++ b/nezha-fronted/src/components/common/language/en.js @@ -6,84 +6,28 @@ const en = { asset:'asset' }, asset:{ - tableTitle:[ - { - label: 'ID', - prop: 'ID', - show: true, - }, { - label: 'Asset Type', - prop: '资产类型', - show: true, - }, { - label: 'Device SN', - prop: 'Device SN', - show: true, - }, { - label: 'IP', - prop: 'IP', - show: true, - }, { - label: '资产状态', - prop: '资产状态', - show: true, - }, { - 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, - }, - ] + tableTitle: { + id: 'ID', + assetType: 'assetType', + Device: 'Device SN', + IP: 'IP', + assetState: 'assetState', + Module: 'Module', + Alarm: 'Alarm', + dataCenter: 'dataCenter', + cabinet: 'cabinet', + model: 'model', + manufacturer: 'manufacturer', + procurementDate: '采购日期', + warrantyDate: '保修截止期', + deviceDuty: '设备责任人', + }, + tagTableTitle: { + projectName: '项目名称', + moduleName: 'Module Name', + endPoint: 'EndPoint', + alarm: 'Alarm', + }, }, ...enLocale } diff --git a/nezha-fronted/src/components/common/login.vue b/nezha-fronted/src/components/common/login.vue index fa978c984..0d2eafa5f 100644 --- a/nezha-fronted/src/components/common/login.vue +++ b/nezha-fronted/src/components/common/login.vue @@ -1,9 +1,23 @@ @@ -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 { \ No newline at end of file diff --git a/nezha-fronted/src/components/common/sideBar.vue b/nezha-fronted/src/components/common/sideBar.vue index 324f9c01a..b10375c7d 100644 --- a/nezha-fronted/src/components/common/sideBar.vue +++ b/nezha-fronted/src/components/common/sideBar.vue @@ -1,56 +1,88 @@ - + + \ No newline at end of file diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue index f61d396c8..2af3bc963 100644 --- a/nezha-fronted/src/components/page/asset/asset.vue +++ b/nezha-fronted/src/components/page/asset/asset.vue @@ -198,7 +198,7 @@ - + 默认CLI账户
@@ -239,8 +239,83 @@ export default { name: "asset", data() { return { - tableTitle: this.$t('asset.tableTitle'), - tagTableTitle: this.$t('asset.tagTableTitle'), + tableTitle: [ + { + 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,12 +338,12 @@ export default { projectName: '2016-05-02', moduleName: '王小虎', endPoint: '上海市普陀区金沙江路 1518 弄' - }, + } ], pageObj: { pageNo: 1, pageSize: 20, - total:0 + total: 0 }, input: '', tabShow: false, @@ -280,18 +355,11 @@ export default { }, methods: { getListData() { - new Promise((resolve, reject) => { - 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) - }) + this.$get('asset', this.pageObj).then(response => { + if (response.code == 200) { + this.tableData = response.data.list + this.pageObj.total = response.data.total + } }) }, tagShow(t) { @@ -309,7 +377,7 @@ export default { this.pageObj.pageNo = val; this.getListData() }, - pageSize(val){ + pageSize(val) { this.pageObj.pageSize = val; this.getListData() } @@ -320,7 +388,7 @@ export default { } \ No newline at end of file diff --git a/nezha-fronted/src/http.js b/nezha-fronted/src/http.js index 23621fd15..cc1b709b2 100644 --- a/nezha-fronted/src/http.js +++ b/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 } diff --git a/nezha-fronted/src/main.js b/nezha-fronted/src/main.js index bd5fd83b9..994dc0b88 100644 --- a/nezha-fronted/src/main.js +++ b/nezha-fronted/src/main.js @@ -5,10 +5,14 @@ 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' +import {post, get} from './http.js' import Pagination from "./components/common/pagination"; //引入全局分页组件 Vue.component("Pagination", Pagination); @@ -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, - components: { App }, + store, + components: {App}, template: '' }) diff --git a/nezha-fronted/src/store/index.js b/nezha-fronted/src/store/index.js new file mode 100644 index 000000000..49d402747 --- /dev/null +++ b/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; \ No newline at end of file