diff --git a/src/pages/workbench/yygl/deployment.vue b/src/pages/workbench/yygl/deployment.vue index a214d981a1cf9ba2a7b2f33b46407138dd7270d6..1cdaa1aab3b5004088c651a8746fc2c9d3b78a6d 100644 --- a/src/pages/workbench/yygl/deployment.vue +++ b/src/pages/workbench/yygl/deployment.vue @@ -50,7 +50,11 @@
- + 下一步
@@ -68,85 +72,91 @@ label-position="top" :rules="app_set_rules" > -
- - - +
+ + + - -
- {{ vision}} -
-
- - - - - +
- - - + {{ vision }} +
+
- - - - - + + + + + + - -
-
- -
- {{ save }} -
-
-
+ + + + + +
+
+ +
+ {{ save }} +
+
+
高级配置 @@ -155,7 +165,11 @@ 上一步 - + 下一步
@@ -170,7 +184,11 @@ 取消 - + 下一步 @@ -261,36 +279,16 @@ export default { }, ], save_arr: [ - [ - "2Gi", - "4Gi", - "8Gi", - "16Gi", - "32Gi", - "64Gi", - "128Gi", - "256Gi", - "512Gi", - ], - [ - "2TB", - "4TB", - "8TB", - "16TB", - "32TB", - "64TB", - "128TB", - "256TB", - "512TB", - ], + ["2Gi", "4Gi", "8Gi", "16Gi", "32Gi", "64Gi", "128Gi", "256Gi", "512Gi"], + ["2TB", "4TB", "8TB", "16TB", "32TB", "64TB", "128TB", "256TB", "512TB"], ], memory_arr: [ { - value: 'Mi', + value: "Mi", label: "Mi", }, { - value: 'Gi', + value: "Gi", label: "Gi", }, ], @@ -303,9 +301,9 @@ export default { { validator: checkName, trigger: "blur" }, ], }, - app_set_code:'', - is_change:false, - is_loading:false, + app_set_code: "", + is_change: false, + is_loading: false, app_set_rules: { title: [{ required: true, message: "请输入标题", trigger: "blur" }], memory: [ @@ -321,167 +319,161 @@ export default { { required: true, message: "请选择存储容量", trigger: "change" }, ], }, - step2_arr:[], + step2_arr: [], evtUuid: "", evtSource: null, stateList: [], finallyState: 0, }), methods: { - get_name_space(){ - this.$http - .get(`/apaas/hubApi/market/namespaces`) - .then((response) => { - console.log(response); - this.area_options = response.data.data - }); + get_name_space() { + this.$http.get(`/apaas/hubApi/market/namespaces`).then((response) => { + console.log(response); + this.area_options = response.data.data; + }); }, get_step_info() { this.$http .get(`/apaas/hubApi/market/step/${this.$route.params.app_id}`) .then((response) => { - let step2_arr = JSON.parse(response.data.data).configInfo + let step2_arr = JSON.parse(response.data.data).configInfo; console.log(step2_arr); - step2_arr.forEach(e => { - if(e.type=='radio'){ - e['val'] = e.value[0] + step2_arr.forEach((e) => { + if (e.type == "radio") { + e["val"] = e.value[0]; // this.deal_key_value(this.app_set_info,e.name,e.type,e.value[0]) - }else if(e.type=='storage'){ - e['dwtype'] = e.storage.indexOf('Gi')==-1?1:0 + } else if (e.type == "storage") { + e["dwtype"] = e.storage.indexOf("Gi") == -1 ? 1 : 0; // this.deal_key_value(this.app_set_info,e.name,e.type,e.storage) - }else if(e.type=='resource'){ - let memory = e.memory - let cpu = e.cpu - e['memory_type'] = memory.indexOf('Mi')==-1?'Gi':'Mi' - e['memory'] = parseInt(memory) - e['cpu'] = parseInt(cpu) + } else if (e.type == "resource") { + let memory = e.memory; + let cpu = e.cpu; + e["memory_type"] = memory.indexOf("Mi") == -1 ? "Gi" : "Mi"; + e["memory"] = parseInt(memory); + e["cpu"] = parseInt(cpu); // this.deal_key_value(this.app_set_info,e.name,'resource',[memory,cpu]) - }else{ + } else { // this.deal_key_value(this.app_set_info,e.name,e.type,e.value) } }); - this.step2_arr=step2_arr; + this.step2_arr = step2_arr; console.log(this.app_set_info); }); }, - get_step_file(){ + get_step_file() { this.$http .get(`/apaas/hubApi/market/values/${this.$route.params.app_id}`) .then((response) => { - this.app_set_code = response.data.data - }) + this.app_set_code = response.data.data; + }); }, - change_appset(obj,key,val){ - console.log(key,val); - this.$set(obj,key,val) + change_appset(obj, key, val) { + console.log(key, val); + this.$set(obj, key, val); }, - deal_key_value(key_string,type,value){ - var key_arr = key_string.split('.') - var temp = this.app_set_info - key_arr.forEach((e,index) => { - if(key_arr.length-1==index){ - if(type == 'resource'){ + deal_key_value(key_string, type, value) { + var key_arr = key_string.split("."); + var temp = this.app_set_info; + key_arr.forEach((e, index) => { + if (key_arr.length - 1 == index) { + if (type == "resource") { temp[e] = { - limits:{ - memory: value[1]+value[0], - cpu:value[2]+'m' + limits: { + memory: value[1] + value[0], + cpu: value[2] + "m", }, - requests:{ - memory: value[1]+value[0], - cpu:value[2]+'m' - } - } - }else if(type == 'storage'){ + requests: { + memory: value[1] + value[0], + cpu: value[2] + "m", + }, + }; + } else if (type == "storage") { temp[e] = { - "volumeClaimTemplate":{ - "spec":{ - "storageClassName":"nfs-client", - "accessModes":[ - "ReadWriteOnce"], - "resources":{ - "requests":{ - "storage":value - } - } + volumeClaimTemplate: { + spec: { + storageClassName: "nfs-client", + accessModes: ["ReadWriteOnce"], + resources: { + requests: { + storage: value, }, - "selector":{ - } - } - } - }else{ - temp[e] = value + }, + }, + selector: {}, + }, + }; + } else { + temp[e] = value; } - }else{ - if(temp[e]){ - - }else{ - temp[e] = {} + } else { + if (temp[e]) { + } else { + temp[e] = {}; } - temp = temp[e] + temp = temp[e]; } }); - }, - deal_key_text(obj,key_string){ - var key_arr = key_string.split('.') + deal_key_text(obj, key_string) { + var key_arr = key_string.split("."); var temp = obj; - key_arr.forEach((e,index) => { - if(key_arr.length-1==index){ - - }else{ - temp = temp[e] + key_arr.forEach((e, index) => { + if (key_arr.length - 1 == index) { + } else { + temp = temp[e]; } }); }, deal_code(n) { if (n) { //调用接口 - this.change_form_aploy(0) + this.change_form_aploy(0); } this.senior_flag = false; }, - change_form_aploy(n){ - this.is_loading = true - if(n==1){ + change_form_aploy(n) { + this.is_loading = true; + if (n == 1) { //表单提交 var temp = { - "app_id": parseInt(this.$route.params.app_id), - "up_userid": this.$store.state.userInfo.user_id, - "name": this.baseInfoForm.name, - "namespace": this.baseInfoForm.namespace, - "uu": this.evtUuid, - "values": this.app_set_info - } - }else{ + app_id: parseInt(this.$route.params.app_id), + up_userid: this.$store.state.userInfo.user_id, + name: this.baseInfoForm.name, + namespace: this.baseInfoForm.namespace, + uu: this.evtUuid, + values: this.app_set_info, + }; + } else { //编辑提交 var temp = { - "app_id": parseInt(this.$route.params.app_id), - "up_userid": this.$store.state.userInfo.user_id, - "name": this.baseInfoForm.name, - "namespace": this.baseInfoForm.namespace, - "uu": this.evtUuid, - "values": yaml.load(this.app_set_code) - } + app_id: parseInt(this.$route.params.app_id), + up_userid: this.$store.state.userInfo.user_id, + name: this.baseInfoForm.name, + namespace: this.baseInfoForm.namespace, + uu: this.evtUuid, + values: yaml.load(this.app_set_code), + }; } this.$http - .post(`/apaas/hubApi/market/build`,temp) + .post(`/apaas/hubApi/market/build`, temp) .then((response) => { - this.is_loading = false - if(response.data.data){ - this.$message.success('开始部署成功') - this.next_step() + this.is_loading = false; + if (response.data.data) { + this.$message.success("开始部署成功"); + this.next_step(); } - }).catch(()=>{ - this.is_loading = false }) + .catch(() => { + this.is_loading = false; + }); }, - sub_yy_form(formName,n) { + sub_yy_form(formName, n) { this.$refs[formName].validate((valid) => { if (valid) { - if(n==1){ - this.get_work_name() - }else if(n==2){ - this.sub_app_set() + if (n == 1) { + this.get_work_name(); + } else if (n == 2) { + this.sub_app_set(); } } else { console.log("error submit!!"); @@ -489,51 +481,58 @@ export default { } }); }, - get_work_name(){ - this.is_loading = true + get_work_name() { + this.is_loading = true; this.$http - .get(`/apaas/hubApi/market/exist/${this.baseInfoForm.namespace}?name=${this.baseInfoForm.name}`) + .get( + `/apaas/hubApi/market/exist/${this.baseInfoForm.namespace}?name=${this.baseInfoForm.name}` + ) .then((response) => { console.log(response); - this.is_loading = false - if(response.data.success){ - if(response.data.data){ - this.$message.error('工作名称已存在') - }else{ + this.is_loading = false; + if (response.data.success) { + if (response.data.data) { + this.$message.error("工作名称已存在"); + } else { this.next_step(); } } - }).catch(()=>{ - this.is_loading = false }) + .catch(() => { + this.is_loading = false; + }); }, - sub_app_set(){ - this.is_loading = true - this.step2_arr.forEach(e => { - if(e.type=='radio'){ - this.deal_key_value(e.name,e.type,e.val) - }else if(e.type=='storage'){ - this.deal_key_value(e.name,e.type,e.storage) - }else if(e.type=='resource'){ - let memory = e.memory - let cpu = e.cpu - this.deal_key_value(e.name,'resource',[e.memory_type,e.memory,e.cpu]) - }else{ - this.deal_key_value(e.name,e.type,e.value) + sub_app_set() { + this.is_loading = true; + this.step2_arr.forEach((e) => { + if (e.type == "radio") { + this.deal_key_value(e.name, e.type, e.val); + } else if (e.type == "storage") { + this.deal_key_value(e.name, e.type, e.storage); + } else if (e.type == "resource") { + let memory = e.memory; + let cpu = e.cpu; + this.deal_key_value(e.name, "resource", [ + e.memory_type, + e.memory, + e.cpu, + ]); + } else { + this.deal_key_value(e.name, e.type, e.value); } }); console.log(this.app_set_info); console.log(this.step2_arr); //表单提交调用接口 - this.change_form_aploy(1) + this.change_form_aploy(1); }, - openstart(item,key) { + openstart(item, key) { if (item[key]) { - this.$set(item,key,false) + this.$set(item, key, false); // item[key] = false; } else { // item[key] = true; - this.$set(item,key,true) + this.$set(item, key, true); } }, pre_step() { @@ -553,83 +552,12 @@ export default { this.evtUuid = evtUuid; this.evtSource = evtSource; - [ - { - id: "values", - type: "message", - data: { - state: "notes", - data: "======================================", - }, - }, - { - id: "values", - type: "message", - data: { - state: "notes", - data: - "host: mapvideo.wodcloud.com\nrepository: hub.wodcloud.com/apaas/apaas-mapvideos\ntag: 1.0.0\n", - }, - }, - { - id: "values", - type: "message", - data: { - state: "notes", - data: "======================================", - }, - }, - { - id: "pull-chart", - type: "message", - data: { - state: "notes", - data: "正在下载charts文件 apaas-mapvideos-1.0", - }, - }, - { - id: "pull-chart", - type: "message", - data: { - state: "notes", - data: "下载charts文件apaas-mapvideos-1.0成功", - }, - }, - { - id: "pull-chart", - type: "message", - data: { state: "notes", data: "正在解压 apaas-ui-1.0.0.tgz" }, - }, - { - id: "pull-chart", - type: "message", - data: { state: "notes", data: "解压 apaas-ui-1.0.0.tgz 完成" }, - }, - { - id: "install", - type: "message", - data: { - state: "notes", - data: - "NAME: ram001\nLAST DEPLOYED: Wed Jul 1 16:09:25 2020\nNAMESPACE: test\nSTATUS: DEPLOYED\n\nRESOURCES:\n==\u003e v1/Pod(related)\nNAME READY STATUS RESTARTS AGE\nram001-65c84bfd8d-xmt2k 0/1 ContainerCreating 0 \u003cinvalid\u003e\n\n==\u003e v1/Service\nNAME TYPE CLUSTER-IP EXTERNAL-IP PORT(S) AGE\nram001 ClusterIP 10.3.181.74 \u003cnone\u003e 80/TCP \u003cinvalid\u003e\n\n==\u003e v1beta1/Deployment\nNAME READY UP-TO-DATE AVAILABLE AGE\nram001 0/1 1 0 \u003cinvalid\u003e\n\n==\u003e v1beta1/Ingress\nNAME HOSTS ADDRESS PORTS AGE\nram001 mapvideo.wodcloud.com 80 \u003cinvalid\u003e\n\n\n", - }, - }, - { - id: "deploy-status", - type: "message", - data: { - state: "success", - data: "在命名空间 test 下部署 ram001 成功!", - }, - }, - ].forEach((msg, index) => { - setTimeout(() => { - this.update_status(msg); - }, (index + 1) * 200); - }); - evtSource.addEventListener("message", (event) => { console.log(event); + this.update_status({ + id: event.lastEventId, + data: JSON.parse(event.data), + }); }); }, update_status(event) {