From 176115bfa9243a42a4f8f098fac2937395202197 Mon Sep 17 00:00:00 2001 From: zhangyu Date: Thu, 20 Aug 2020 17:09:22 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=B7=BB=E5=8A=A0=20?= =?UTF-8?q?=E5=92=8C=E5=88=87=E6=8D=A2project=E7=9A=84=E9=83=A8=E5=88=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/common/project/LRArrow.png | Bin 0 -> 308 bytes .../src/components/common/project/addLine.vue | 133 ++++++++++++++---- .../src/components/common/project/addNode.vue | 22 ++- .../components/common/project/leftArrow.png | Bin 0 -> 256 bytes .../src/components/common/project/noArrow.png | Bin 0 -> 198 bytes .../components/common/project/rightArrow.png | Bin 0 -> 270 bytes .../components/common/project/topology.vue | 22 ++- .../components/common/project/visNetwork.vue | 54 +++---- 8 files changed, 159 insertions(+), 72 deletions(-) create mode 100644 nezha-fronted/src/components/common/project/LRArrow.png create mode 100644 nezha-fronted/src/components/common/project/leftArrow.png create mode 100644 nezha-fronted/src/components/common/project/noArrow.png create mode 100644 nezha-fronted/src/components/common/project/rightArrow.png diff --git a/nezha-fronted/src/components/common/project/LRArrow.png b/nezha-fronted/src/components/common/project/LRArrow.png new file mode 100644 index 0000000000000000000000000000000000000000..ea3646f283d87994b32432133f9a75ba90a94f49 GIT binary patch literal 308 zcmeAS@N?(olHy`uVBq!ia0vp^wLr|n!3HG#|7~&vQjEnx?oJHr&dIz4a#+$GeSv}- z`?>!lvI6;>1s;*b3=BdgAk26#O}+vsc+%6wF(ktM?evXYhYUnq|JItjo2$qEY2ef2 z(|h#b$rA-Xza|BZT{e}MxE1##O!l~ZsrrF~^ei6RmMzMP&CM6tJxabjf2}+FZ(vz_ zu&vXrl)&7lH9N1BXPWf&-I)B->)7U3)xNjf@9&)@{6D?K-Yn&d(GK1#Q+^zLvGB%( zi>DK|1|&b4eKG%gyU+CO;==m@HL~01wa-bPZN=aAYwtpXYIWlTd}O1dwb)r z>&AE6$-E$`_DFf&!22WQ%mvv4FO#s?$ Be*gdg literal 0 HcmV?d00001 diff --git a/nezha-fronted/src/components/common/project/addLine.vue b/nezha-fronted/src/components/common/project/addLine.vue index 749d907f1..27316393a 100644 --- a/nezha-fronted/src/components/common/project/addLine.vue +++ b/nezha-fronted/src/components/common/project/addLine.vue @@ -2,38 +2,50 @@
- + + + +
-
{{$t("project.endpoint.editEndpoint") + " ID：" + lineData.id}}
+
Add Line
- - + + - - - - - + + +
+ + + + +
+ + + + - - - - - - + +
+
+ {{form.color}} +
+
+ + +
@@ -63,7 +75,6 @@ handler(n){ this.form={ arrows:n.arrows, - label:n.label, color:n.color, lineId:n.id, } @@ -78,6 +89,7 @@ arrows:'', label:'', color:'#1e90ff', + lineName:'', lineId:'', }, predefineColors: [ @@ -91,15 +103,23 @@ ], rules:{ arrows: [ - { required: true, message: '请输入活动名称', trigger: 'change' }, + { required: true, message: '', trigger: 'change' }, + ], + lineName: [ + { required: true, message: '', trigger: 'change' }, ], } } }, methods:{ onSubmit(){ - let model=Object.assign({id:this.form.lineId},{...this.form},{color: {color:this.form.color,highlight:this.form.color,hover:this.form.color,opacity:1.0}}); - this.$emit('addLine',model) + + this.$refs['form'].validate((valid) => { + if (valid) { + let model=Object.assign({id:Math.random()*100},{...this.form},{color: {color:this.form.color,highlight:this.form.color,hover:this.form.color,opacity:1.0}}); + this.$emit('addLine',model); + } + }); }, /*关闭弹框*/ esc(refresh) { @@ -111,13 +131,76 @@ del(){ this.$emit('del'); this.esc(); - } + }, + colorPickerClick(){ + console.log(this.$refs['colorPicker']); + this.$refs['colorPicker'].showPicker=true; + }, + iconChange (val) { + // el-select实际上是两层div包裹的input + this.addModel.icon = val; + // 获取当前el-select标签第一层div + const dom = this.$refs['select_icon'].$el; + // 创建需要添加到其中的标签 并填充内容 + const svgDom = document.createElement('span'); // (''); + svgDom.setAttribute('class', 'el-input__prefix'); + svgDom.innerHTML = ''; + // 将创建的标签添加到父节点(第二层div) + dom.children[0].appendChild(svgDom); + // 得到el-select中的input标签 + const inputDom = dom.children[0].children[0]; + inputDom.setAttribute('style', 'padding-left: 30px;'); + // 将添加的标签放到input前面 + dom.children[0].insertBefore(svgDom, inputDom); + }, }, }