diff --git a/nezha-fronted/src/assets/stylus/main.scss b/nezha-fronted/src/assets/stylus/main.scss index 51657895c..ff802a55d 100644 --- a/nezha-fronted/src/assets/stylus/main.scss +++ b/nezha-fronted/src/assets/stylus/main.scss @@ -880,6 +880,7 @@ li{ } .right-box-add-endpoint { width: 850px; + transition: width 200ms; } .right-box-add-endpoint.right-box-add-endpoint-snmp { width: 690px; diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js index 6eb7e3961..0bf6ee5a9 100644 --- a/nezha-fronted/src/components/common/language/en.js +++ b/nezha-fronted/src/components/common/language/en.js @@ -41,6 +41,7 @@ const en = { changePwd:'Change password',//修改密码 createChart:'Create chart', createProject:'Create project', + createEndpoint:'Create Endpoint', createAsset:'Create asset', createAlertRule:'Create alert rule', createAccount:'Create account', diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue index 3b1308efd..fcb29fc6a 100644 --- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue +++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue @@ -15,7 +15,7 @@ - + @@ -404,7 +404,7 @@ this.$get('project', {pageSize: -1, pageNo: 1}).then(response => { if (response.code === 200) { this.projectList = response.data.list; - this.getModuleList(this.currentProject.id); + this.getModuleList(this.currentProjectCopy.id); } }); }, @@ -449,6 +449,7 @@ this.tempParamObj = []; this.endpointList = []; this.getAssetList(); + this.getModuleList(project.id); }, changeModule(module) { @@ -482,7 +483,7 @@ }); this.assetList.splice(index, 1); this.endpointTouch = true; - this.endpointForm.projectId = this.currentProject.id; + this.endpointForm.projectId = this.currentProjectCopy.id; this.endpointForm.moduleId = this.currentModuleCopy.id; this.$refs.assetScrollbar.update(); }, @@ -523,7 +524,7 @@ //保存endpoint save() { - this.endpointForm.projectId = this.currentProject.id; + this.endpointForm.projectId = this.currentProjectCopy.id; this.endpointForm.moduleId = this.currentModuleCopy.id; if (this.endpointList.length == 0) { this.endpointTouch = true; @@ -593,6 +594,7 @@ clearEndpoints() { this.getAssetList(); this.endpointList = []; + this.assetSearch= {host: '', sn: '', text: '', label: 'IP', dropdownShow: false} }, setRowIndex({row, rowIndex}) { @@ -622,10 +624,9 @@ }, currentProject(n, o) { + this.currentProjectCopy=Object.assign({},n); this.endpointForm.projectId = n.id; - if(n.id != o.id){ - this.getModuleList(n.id); - } + this.getModuleList(n.id); }, currentModule: { immediate: true, @@ -653,7 +654,7 @@ this.getProjectList(); }, moduleListReloadWatch(n, o) { - this.getModuleList(this.currentProject.id); + this.getModuleList(this.currentProjectCopy.id); } } } diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue index dbe8de7b2..1189f0a1a 100644 --- a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue +++ b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue @@ -23,15 +23,15 @@ - - + +
{{endpoint.project.name}}
- - + +
{{endpoint.module.name}}
@@ -189,17 +189,18 @@ export default { name: "endpointBox", props: { - endpoint: Object, - currentProject: Object, - currentModule: Object + postEndpoint: Object, }, data() { return { + endpoint:null, rightBox: {show: false, title: '',isEdit: false}, subBox: {show: false, title: this.$t("overall.asset")}, //asset子弹框 assetSearch: {host: '', sn: '', text: '', label: 'IP', dropdownShow: false}, //侧滑框中asset的搜索相关 assetPageObj: {pageNo: 1, pageSize: 11, total: 0}, selectedAsset: {id: '', host: '', sn: ''}, //endpoint侧滑框中选中的asset + currentProject: null, + currentModule: null, projectList: [], moduleList: [], assetList: [], @@ -230,11 +231,15 @@ toEdit(show, id) { this.rightBox.isEdit = show; this.rightBox.show = true; - if (show) { - this.rightBox.title = this.$t("project.endpoint.editEndpoint") + " ID:" + id; - } else { - this.rightBox.title = this.$t("project.endpoint.endpoint") + " ID:" + id; - } + this.$nextTick(()=>{ + if (show) { + this.rightBox.title = this.$t("project.endpoint.editEndpoint") + " ID:" + id; + this.currentProject=this.projectList.find(item=>{return item.id == this.endpoint.projectId}) + this.getModuleList(this.endpoint.projectId,true) + } else { + this.rightBox.title = this.$t("project.endpoint.endpoint") + " ID:" + id; + } + }); }, //endpoint弹框中asset子弹框控制 @@ -309,17 +314,18 @@ }, //project下拉框点击事件 - changeProject(project) { - this.currentModule = {id: '', name: '', project: {}, port: '', path: '', param: '', paramObj: []}; - this.getModuleList(project.id); + changeProject(projectId) { + this.currentModule = {id: '', name: '', project: {},type:'', port: '', path: '', param: '', paramObj: []}; + this.getModuleList(projectId); + this.endpoint.moduleId=''; }, //project下拉框点击事件 - changeModule(module) { - this.currentModule = module; - this.endpoint.port = module.port; - this.endpoint.path = module.path; - this.endpoint.paramObj = module.paramObj; + changeModule(moduleId) { + this.currentModule = this.moduleList.find(item=>{return item.id == this.endpoint.moduleId}); + this.endpoint.port = this.currentModule.port; + this.endpoint.path = this.currentModule.path; + this.endpoint.paramObj = this.currentModule.paramObj; }, // 获取endpoint弹框中的asset子弹框里asset列表数据 @@ -372,7 +378,7 @@ } }, // 获取endpoint弹框中module下拉框数据 - getModuleList(projectId) { + getModuleList(projectId,setCurModule=false) { this.$get('module', {projectId: projectId}).then(response => { if (response.code === 200) { for (let i = 0; i < response.data.list.length; i++) { @@ -387,6 +393,9 @@ } } this.moduleList = response.data.list; + if(setCurModule){ + this.currentModule=this.moduleList.find(item=>{return item.id == this.endpoint.moduleId}); + } } }); }, @@ -467,7 +476,7 @@ }, }, mounted() { - setTimeout(()=>{this.getModuleList(this.currentProject.id);}, 100); + // setTimeout(()=>{this.getModuleList(this.currentProject.id);}, 100); }, watch: { projectListReloadWatch(n, o) { @@ -475,7 +484,14 @@ }, moduleListReloadWatch(n, o) { this.getModuleList(this.currentProject.id); - } + }, + postEndpoint:{ + immediate:true, + deep:true, + handler(n,o){ + this.endpoint=Object.assign({},n) + }, + }, } } diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue index a1fa0ec9d..6a4cd577c 100644 --- a/nezha-fronted/src/components/page/project/project.vue +++ b/nezha-fronted/src/components/page/project/project.vue @@ -91,7 +91,7 @@ class="margin-l-20" >