From 1b1c31b73f4924779e5db6a5dd84b2344f6851f6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=8A=B2=E6=9D=BE?= Date: Wed, 1 Apr 2020 21:21:42 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20module=E4=BE=A7=E6=BB=91=E6=96=B0?= =?UTF-8?q?=E5=A2=9E=E3=80=81=E4=BF=AE=E6=94=B9=E5=A2=9E=E5=8A=A0snmp?= =?UTF-8?q?=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- nezha-fronted/src/assets/stylus/main.scss | 19 +- .../src/components/common/header.vue | 18 +- .../src/components/common/language/en.js | 14 +- .../components/common/rightBox/assetBox.vue | 24 +- .../components/common/rightBox/moduleBox.vue | 295 +++++++++++++++++- .../src/components/page/alert/list.vue | 3 +- 6 files changed, 342 insertions(+), 31 deletions(-) diff --git a/nezha-fronted/src/assets/stylus/main.scss b/nezha-fronted/src/assets/stylus/main.scss index 81ad1155b..707217e7a 100644 --- a/nezha-fronted/src/assets/stylus/main.scss +++ b/nezha-fronted/src/assets/stylus/main.scss @@ -858,6 +858,13 @@ li{ .right-box .el-form-item__label { line-height: 30px; } +.right-box-sub-title { + padding: 8px 0; +} +.right-box-line { + margin-bottom: 18px; + background-color: #DCDFE6; +} .pop-top-btns { text-align: center; float: right; @@ -1304,6 +1311,16 @@ li{ .el-checkbox__input.is-checked .el-checkbox__inner, .asset .content-left .el-checkbox__input.is-indeterminate .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner { background-color: $global-text-color-active; } + +.el-radio-button__inner:hover { + color: $global-text-color-active; +} + +.el-radio-button__orig-radio:checked+.el-radio-button__inner { + background-color: $global-text-color-active; + border-color: $global-text-color-active; + box-shadow: -1px 0 0 0 $global-text-color-active; +} /* --end--复选框自定义颜色 */ /* dashboard-dialog */ @@ -1377,7 +1394,7 @@ li{ line-height: 25px !important; } -.el-textarea textarea { +.el-textarea textarea:not(.snmp-walk textarea) { height: 140px !important; } /*el-data-picker选中背景色*/ diff --git a/nezha-fronted/src/components/common/header.vue b/nezha-fronted/src/components/common/header.vue index e6e29b8d7..1f66941da 100644 --- a/nezha-fronted/src/components/common/header.vue +++ b/nezha-fronted/src/components/common/header.vue @@ -292,7 +292,23 @@ port: '', path: '', param: '', - paramObj: [] + type: '', + paramObj: [], + //snmp setting 下划线命名是因为业务需求 + walk: [], + walkStr: '', //转为string的walk,用于回显 + version: 2, //2/3 + max_repetitions: 25, + retries: 3, + timeout: 10, //s + community: 'public', + username: '', + security_level: 'noAuthNoPriv', //noAuthNoPriv/authNoPriv/authPriv + password: '', + auth_protocol: 'MD5', //MD5/SHA + priv_protocol: 'DES', //DES/AES + priv_password: '', + context_name: '' }; } else if (item.type == 3) { this.$refs.addEndpointBox.show(true); diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js index eacacf3c8..2a93f24d9 100644 --- a/nezha-fronted/src/components/common/language/en.js +++ b/nezha-fronted/src/components/common/language/en.js @@ -270,7 +270,8 @@ const en = { refreshLater:'Refresh later',//'请稍后刷新' testSuccess:'Test success', downloadSuccess : 'Download Success', - uploadSuccess: 'Upload Success' + uploadSuccess: 'Upload Success', + pressEnterToAdd: 'Press enter to add new line' }, asset:{ asset: 'Asset', @@ -669,6 +670,17 @@ const en = { editModule: 'Edit module',//"编辑组件" description: 'Description',//"描述" createModule: 'New module',//"新增组件" + version: 'Version', + walk: 'Walk', + maxRepetitions: 'Max repetitions', + retries: 'Retries', + timeout: 'Timeout', + community: 'Community', + securityLevel: 'Security level', + authProtocol: 'Auth protocol', + privProtocol: 'Priv protocol', + contextName: 'Context name', + privPassword: 'Priv password', tip: { defaultEndpointSet: 'Default endpoint settings',//"默认的Endpoint设置" relation: 'Module associated Endpoint will configure the following ports/paths/parameters by default'//"组件关联的Endpoint将默认配置以下端口/路径/参数" diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue index 0003fc2e8..7e52d861b 100644 --- a/nezha-fronted/src/components/common/rightBox/assetBox.vue +++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue @@ -61,8 +61,8 @@ -
{{$t('asset.createAssetTab.assetInfo')}}
-
+
{{$t('asset.createAssetTab.assetInfo')}}
+
{{assetData.purchaseDate}} -
{{$t('asset.createAssetTab.dc')}}
-
+
{{$t('asset.createAssetTab.dc')}}
+
@@ -1308,13 +1308,3 @@ } } - - diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue index 5ed18e6a4..570a1ad34 100644 --- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue +++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue @@ -19,7 +19,7 @@ - + @@ -31,36 +31,224 @@
{{module.name}}
+ + + + + + + + + + +
{{module.remark}}
+
{{$t('project.module.tip.defaultEndpointSet')}}
{{$t('project.module.tip.relation')}}
- + +
{{module.port}}
- - + + +
{{module.path}}
+ +
@@ -123,8 +311,18 @@ port: [ {validator:port, trigger: 'blur'}, ], - path: [ - ] + walk: [ + {required: true, message: this.$t('validate.required'), trigger: 'blur'} + ], + username: [ + {required: true, message: this.$t('validate.required'), trigger: 'blur'} + ], + password: [ + {required: true, message: this.$t('validate.required'), trigger: 'blur'} + ], + priv_password: [ + {required: true, message: this.$t('validate.required'), trigger: 'blur'} + ], }, projectList: [], } @@ -144,11 +342,66 @@ this.esc(); }, + //转化snmpParam属性 + parseSnmpParam() { + let snmpObj = { //下划线命名是因为业务需求 + walk: this.module.walkStr.split(/\n/), + version: this.module.version, //2/3 + max_repetitions: this.module.max_repetitions ? this.module.max_repetitions : 25, + retries: this.module.retries ? this.module.retries : 3, + timeout: this.module.timeout ? this.module.timeout + "s" : "10s", //s + auth: { + community: this.module.community, + } + }; + if (this.module.version == 3) { + snmpObj.auth.username = this.module.username; + snmpObj.auth.security_level = this.module.security_level; + } + if (this.module.security_level == "authNoPriv" || this.module.security_level == "authPriv") { + snmpObj.auth.password = this.module.password; + snmpObj.auth.auth_protocol = this.module.auth_protocol; + if (this.module.security_level != "authNoPriv") { + snmpObj.auth.priv_password = this.module.priv_password; + snmpObj.auth.priv_protocol = this.module.priv_protocol; + } + } + this.module.snmpParam = JSON.stringify(snmpObj); + }, + //回显时解析snmpParam + reparseSnmpParam(module) { + let snmpObj = JSON.parse(module.snmpParam); + module.walkStr = snmpObj.walk.join("\n"); + module.version = snmpObj.version; + module.max_repetitions = snmpObj.max_repetitions; + module.retries = snmpObj.retries; + module.timeout = parseInt(snmpObj.timeout.replace("s", "")); + module.community = snmpObj.auth.community; + if (snmpObj.version == 3) { + module.username = snmpObj.auth.username; + module.security_level = snmpObj.auth.security_level; + } + if (snmpObj.auth.security_level == "authNoPriv" || snmpObj.auth.security_level == "authPriv") { + module.password = snmpObj.auth.password; + module.auth_protocol = snmpObj.auth.auth_protocol; + if (snmpObj.auth.security_level != "authNoPriv") { + module.priv_password = snmpObj.auth.priv_password; + module.priv_protocol = snmpObj.auth.priv_protocol; + } + } + }, /*保存*/ save() { this.module.param = this.paramToJson(this.module.paramObj); this.$refs.moduleForm.validate((valid) => { if (valid) { + if (this.module.type.toLowerCase() == 'snmp') { + this.parseSnmpParam(); + } else { + if (this.module.snmpParam) { + this.module.snmpParam = ""; + } + } this.module.projectId = this.module.project.id; if (this.module.id) { this.$put('module', this.module).then(response => { @@ -251,6 +504,9 @@ return jsonString; } }, + updateScrollbar() { + this.$refs.scrollbar.update(); + } }, created() { this.getProjectList(); @@ -263,11 +519,20 @@ watch: { module: { immediate: true, - deep:true, + deep: true, handler(n, o) { + if (n) { + if (n.type && n.type.toLowerCase() == 'snmp') { + n.port = 161; + this.reparseSnmpParam(n); + } + } if (n && n.id) { this.rightBox.title =this.rightBox.isEdit? this.$t("project.module.editModule") + " ID:" + n.id : this.$t("project.module.module") + " ID:" + n.id ; } else { + if (!n.type) { + n.type = 'http'; + } this.rightBox.title = this.$t("project.module.createModule"); } } @@ -279,5 +544,17 @@ } - diff --git a/nezha-fronted/src/components/page/alert/list.vue b/nezha-fronted/src/components/page/alert/list.vue index af75418f4..590453efe 100644 --- a/nezha-fronted/src/components/page/alert/list.vue +++ b/nezha-fronted/src/components/page/alert/list.vue @@ -8,8 +8,7 @@