Skip to content

A
apaas-ui
Commit 3ab1d9fc authored by 张俊's avatar 张俊
Browse files
Options

运行状态微服务

parent 4ae59482
Hide whitespace changes
Inline Side-by-side
Showing with 127 additions and 64 deletions
src/components/table/table-um.vue
View file @ 3ab1d9fc
......@@ -86,7 +86,7 @@
<template slot-scope="scope">
<!-- 操作按钮 -->
<span v-if="item.type === 'Button'">
<b v-for="(btn, key) in item.btnList" :key="key" :style="{marginRight:item.btngap}" v-if="!item.public_flag||item.public_flag==false?true:get_show_func(key,scope)">
<b v-for="(btn, key) in item.btnList" :key="key" :style="{marginRight:item.btngap}">
<em v-if="btn.label == '分配'">
<em
v-if="btn.label == '分配' && scope.row.state == 0"
......
src/pages/workbench/yygl/deploy_app_detail.vue
View file @ 3ab1d9fc
......@@ -181,20 +181,38 @@
:key="index + 6000"
>{{ item.name }}</span>
</p>
<table-um
<el-table
:data="image_arr[index].data"
v-for="(item, index) in image_arr"
:key="index+7000"
:height="300"
v-show="image_select == index"
:headers="header_image_arr"
:datas="image_arr[index].data"
:public_arr="now_image_version"
:stripe="true"
@update="update"
@rollback="rollback"
@grouppublic="grouppublic"
@online="online"
></table-um>
stripe
height="300"
style="width: 100%">
<el-table-column
prop="tag"
align="center"
label="版本号">
</el-table-column>
<el-table-column
prop="date"
align="center"
label="在线日期">
</el-table-column>
<el-table-column
label="操作"
align="center"
width="300">
<template slot-scope="scope">
<el-button @click="update(scope.row)" type="text" size="small" :disabled="up_flag" v-if="(!scope.row.subsets)&&scope.$index<Math.min(...now_image_version)">升级</el-button>
<el-button @click="update(scope.row)" type="text" size="small" :disabled="up_flag" v-if="(!scope.row.subsets)&&scope.$index>Math.max(...now_image_version)">回滚</el-button>
<el-button @click="together(scope.row)" type="text" size="small" :disabled="up_flag" v-if="(!scope.row.subsets)&&scope.$index<Math.min(...now_image_version)">蓝绿发布</el-button>
<el-button type="text" size="small" :disabled="true" v-if="scope.row.subsets">当前版本</el-button>
<el-button @click="delete_ver(scope.row)" style="color:#830f53;font-weight:600;" type="text" size="small" :disabled="up_flag" v-if="scope.row.subsets&&now_image_version.length>=2">删除</el-button>
</template>
</el-table-column>
</el-table>
</nor-card>
</div>
</div>
......@@ -208,7 +226,6 @@
<script>
import infoList from "@/components/infoList";
import tableUm from "@/components/table/table-um";
import serviceHeader from "@/components/service-header";
import dialogAction from "@/components/dialog-action";
import uploadFile from "@/components/general/upload_file";
......@@ -220,7 +237,6 @@ import { mapGetters, mapState } from "vuex";
export default {
components: {
infoList,
tableUm,
serviceHeader,
dialogAction,
uploadFile,
......@@ -325,47 +341,6 @@ export default {
{ required: true, message: "请选择开放程度", trigger: "change" }
]
},
header_image_arr: [
{
prop: "tag",
label: "版本号",
align: "center"
},
{
prop: "date",
label: "在线日期",
align: "center"
},
{
label: "操作",
type: "Button",
align: "center",
btngap:'15px',
public_flag:true,
btnList: [
{
type: "update",
label: "升级"
},
{
type: "rollback",
label: "回滚"
},
{
type: "grouppublic",
label: "蓝绿发布"
},
{
type: "online",
label: "当前版本",
},
{
type: "delete",
label: "删除"
},
]
}
],
header_fw_arr: [
{
prop: "rank",
......@@ -514,7 +489,9 @@ export default {
appcode: "",
showPass: false,
public: false,
public_form: false
public_form: false,
now_tag:'',
up_flag:false,
};
},
computed: {
......@@ -536,8 +513,25 @@ export default {
this.now_service = 1;
}
},
mounted() {},
mounted() {
},
methods: {
event_source(){
var _this = this
const se = new EventSource(`/apaas/istio/service/${this.header_data.namespace}/versions/events/${this.service_list_arr[this.now_micor_service].service}/${this.now_tag}/subscribe`, { withCredentials: true }) // 后端接口，要配置允许跨域属性
se.onopen=function(e){}
se.onmessage=function(e){
console.log(e.data)
se.close()
setTimeout(() => {
_this.get_micro_service()
_this.$message.success('更新完成')
}, 100);
}
se.onerror=function(e){}
},
getCurrentUser() {
this.$api.user.getNowUser().then(({ data }) => {
if (data.success == 1) {
......@@ -556,7 +550,37 @@ export default {
console.log(val);
},
update(val) {
console.log(val);
this.up_flag = true
this.$message.success('开始更新版本')
this.$http
.post(`/apaas/istio/service/${this.header_data.namespace}/image/${this.service_list_arr[this.now_micor_service].service}/${this.image_arr[this.image_select].name}/update`,{
tag:val.tag
})
.then(response => {
if(response.data.success){
this.get_micro_service(true)
}
})
},
together(val){
this.up_flag = true
this.$http
.post(`/apaas/istio/service/${this.header_data.namespace}/image/${this.service_list_arr[this.now_micor_service].service}/${this.image_arr[this.image_select].name}/publish`,{
tag:val.tag
}).then(response => {
this.up_flag = false
this.get_micro_service()
})
},
delete_ver(val){
this.up_flag = true
this.$http
.post(`/apaas/istio/service/${this.header_data.namespace}/image/${this.service_list_arr[this.now_micor_service].service}/${this.image_arr[this.image_select].name}/unpublish`,{
tag:val.tag
}).then(response => {
this.up_flag = false
this.get_micro_service(true,val.subsets)
})
},
rollback(val) {
console.log(val);
......@@ -585,7 +609,7 @@ export default {
}
})
},
get_micro_service(){
get_micro_service(val,type){
this.$http
.get(`/apaas/istio/service/${this.header_data.namespace}/overview/${this.service_list_arr[this.now_micor_service].service}`)
.then(response => {
......@@ -606,7 +630,7 @@ export default {
maxTraffic: data.throughput.max,
memory: data.resource.memory
}
this.getImageInfo()
this.getImageInfo(val,type)
}
})
},
......@@ -618,19 +642,58 @@ export default {
return function(a,b){
var value1 = a[property];
var value2 = b[property];
// return value2 - value1;
return value1 - value2;
return value2 - value1;
// return value1 - value2;
}
},
getImageInfo() {
getImageInfo(val,type) {
this.$http
.get(`/apaas/istio/service/${this.header_data.namespace}/image/${this.service_list_arr[this.now_micor_service].service}/${this.image_arr[this.image_select].name}/versions`)
.then(response => {
console.log(response);
var _this = this
let data = response.data.data;
// this.image_arr = data.imagearr;
// console.log(data.list.sort(_this.compare('date')))
data.list.forEach(e => {
data.runnings.forEach(el => {
if(e.tag==el.tag){
e['subsets'] = el.subsets
}
});
});
this.$set(this.image_arr[this.image_select],'data',data.list.sort(this.compare('date')))
this.now_image_version = data.runnings
this.now_image_version = []
this.image_arr[this.image_select].data.forEach((e,idx)=> {
if(e.subsets){
this.now_image_version.push(idx)
}
});
if(val){
//删除
if(type){
var temp = ''
this.now_tag.forEach(e => {
if(type==e){
}else{
temp = e
}
});
this.now_tag = temp
}
//调用监听
this.event_source()
}else{
if(data.runnings.length==1){
this.now_tag = data.runnings[0].subsets
}else{
this.now_tag = [data.runnings[0].subsets,data.runnings[1].subsets]
}
this.up_flag = false
}
// console.log(Math.min(...now_image_version))
})
.catch(function(response) {});
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment