Skip to content

A
apaas-ui
Commit 223cb2d2 authored by 张俊's avatar 张俊
Browse files
Options

应用调试

parent c9d95096
Hide whitespace changes
Inline Side-by-side
Showing with 358 additions and 175 deletions
src/components/apass-dialog.vue
View file @ 223cb2d2
......@@ -72,7 +72,7 @@ export default {
default: () => false,
},
submit: {
type: Function,
type: [Function,String],
default: () => null,
},
},
......
src/components/service-header.vue
View file @ 223cb2d2
......@@ -92,8 +92,7 @@ export default {
},
mounted() {},
methods: {
subevent(val){
debugger
subevent(val){
if(val == 0){
// this.$emit('deploy',this.data)
this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/deployment/${this.$route.params.id}`)
......
src/pages/workbench/fwgl/approval_service_detail.vue
View file @ 223cb2d2
......@@ -352,7 +352,6 @@ export default {
this.$set(this.list_arr[5], "info", data.service_apply_info.business_url);
this.$set(this.list_arr[6], "info", data.service_apply_info.apply_file.split('/')[data.service_apply_info.apply_file.split('/').length - 1]);
this.$set(this.list_arr[6], "url", data.service_apply_info.apply_file);
debugger
this.$set(this.list_arr[8], "info", data.service_apply_info.duration+(data.service_apply_info.duration_unit==1?'月':'年'));
this.$set(this.list_arr[9], "info", "访问次数："+data.service_apply_info.request_spcs.pv+"/日 访问量："+data.service_apply_info.request_spcs.count+"/日");
this.id = data.service_apply_info.id
......
src/pages/workbench/yygl/app_debugger.vue
View file @ 223cb2d2
......@@ -53,7 +53,8 @@
<div class="tips">
<i class="el-icon-warning-outline"></i><span>此操作相当于：kubectl apply -f {{'<'+'spec.yaml'+'>'}}</span>
</div>
<v-apaas-code :datas="code_arr"></v-apaas-code>
<v-apaas-code :datas="code_arr" v-show="now_yaml==1"></v-apaas-code>
<v-apaas-code :datas="yaml_arr" v-show="now_yaml==0"></v-apaas-code>
</div>
</div>
......@@ -93,6 +94,7 @@ export default {
now_yaml:0,
pod_name:'',
code_arr:'',
yaml_arr:'',
area_arr:[],
app_arr:[],
tableData:[],
......@@ -126,14 +128,12 @@ export default {
{
prop: "name",
label: "名称",
minWidth: "40%",
align: "left",
type: "button"
},
{
prop: "tag",
label: "标签",
minWidth: "60%",
align: "left",
type: "tag",
},
......@@ -206,13 +206,6 @@ export default {
methods: {
changyaml(n){
this.now_yaml = n
if(n==0){
this.code_arr = yaml.stringify(this.code_arr)
}else{
console.log(json.load(this.code_arr));
console.log(JSON.stringify(json.load(this.code_arr), null, 2));
this.code_arr = JSON.stringify(json.load(this.code_arr), null, 2);
}
},
get_namespace_list(){
this.$http
......@@ -232,11 +225,20 @@ export default {
}
})
},
gotopage(){
this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/appdebuggerdetail/${this.$route.params.deploy_id}?content=0`)
gotopage(val){
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/_raw/pod/namespace/${val.namespace}/name/${val.name}`)
.then(response => {
this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/appdebuggerdetail/${this.$route.params.deploy_id}?content=0&namespace=${val.namespace}&name=${val.name}&container=${response.data.spec.containers[0].name}`)
})
},
gotopage1(){
this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/appdebuggerdetail/${this.$route.params.deploy_id}?content=1`)
gotopage1(val){
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/_raw/pod/namespace/${val.namespace}/name/${val.name}`)
.then(response => {
this.$router.push(`/yygl/${this.$route.params.level}/${this.$route.params.type}/appdebuggerdetail/${this.$route.params.deploy_id}?content=1&namespace=${val.namespace}&name=${val.name}&container=${response.data.spec.containers[0].name}`)
})
},
get_list_pod(){
this.$http
......@@ -301,8 +303,8 @@ export default {
.get(`/awecloud/rest/kubernetes/api/v1/_raw/pod/namespace/${val.namespace}/name/${val.name}`)
.then(response => {
console.log(response.data);
debugger
this.code_arr = yaml.stringify(response.data)
this.yaml_arr = yaml.stringify(response.data)
this.code_arr = JSON.stringify(json.load(this.yaml_arr), null, 2);
this.$refs.actiondialog.show();
})
......
src/pages/workbench/yygl/app_debugger_detail.vue
View file @ 223cb2d2
......@@ -10,10 +10,10 @@
<span>{{ $route.query.content == 1 ? "命令行" : "容器日志" }}</span>
<el-select v-model="pod" placeholder="请选择">
<el-option
v-for="item in pod_arr"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="(item,index) in pod_arr"
:key="index+60000"
:label="item"
:value="item"
>
</el-option>
</el-select>
......@@ -24,14 +24,14 @@
v-if="$route.query.content == 0"
>
<el-option
v-for="item in pod_group_arr"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="(item,index) in pod_group_arr"
:key="index+80000"
:label="item"
:value="item"
>
</el-option>
</el-select>
<span v-if="$route.query.content == 1">在请问请问1212</span>
<span v-if="$route.query.content == 1">在 {{now_app}}</span>
<div v-if="$route.query.content == 0" style="float:right;">
<el-tooltip class="item" effect="dark" content="显示时间戳" placement="top">
<div class="time" @click="change_contl(0)" :style="control_arr[0]?{backgroundImage:'url('+require('../../../assets/imgs/rqrz_btn_time_sel.png')+')'}:''"></div>
......@@ -51,16 +51,18 @@
<p
v-for="(item, index) in data_arr"
:key="index + 89000"
v-html="(control_arr[0]?'1111':'')+item"
v-html="(control_arr[0]?item.timestamp:'')+item.content"
></p>
</el-scrollbar>
<div id="xterm_contain" v-if="$route.query.content == 1"></div>
<p class="code" v-if="$route.query.content == 0">
<span>日志范围从 4/22/20 3:05 AM 到 4/22/20 3:05 AM UTC</span>
<span>日志范围从 {{from_log}} 到 {{to_log}}</span>
<img
:src="item"
:src="item[logFilePosition=='end'&&(index==0||index==1)?1:logFilePosition=='beginning'&&(index==2||index==3)?1:0]"
alt=""
v-for="(item, index) in image_arr"
@click="page(3-index,logFilePosition=='end'&&(index==0||index==1)?1:logFilePosition=='beginning'&&(index==2||index==3)?1:0)"
:style="logFilePosition=='end'&&(index==0||index==1)?{cursor:'not-allowed'}:logFilePosition=='beginning'&&(index==2||index==3)?{cursor:'not-allowed'}:0"
:key="index + 12000"
/>
</p>
......@@ -71,6 +73,7 @@
title="下载日志文件"
sunbmitText="保存"
:submitDisable="download_flag"
submit="file"
@submit="save_file"
>
<template slot="content">
......@@ -91,6 +94,8 @@ import "xterm/css/xterm.css";
import { Terminal } from "xterm";
import { FitAddon } from 'xterm-addon-fit';
import apassDialog from '@/components/apass-dialog'
import helper from '@/services/helper'
import SockJS from "sockjs-client";
export default {
props: [],
components: {
......@@ -99,151 +104,278 @@ export default {
data() {
return {
pod: "",
image_arr: [],
control_arr:[0,0,0],
pod_arr: [
{
value: 1,
label: "jakdsj",
},
{
value: 2,
label: "容器1",
},
{
value: 3,
label: "容器2",
},
image_arr: [
[
require('../../../assets/imgs/btn_last_page.png'),
require('../../../assets/imgs/btn_last_page_dis.png')
],
[
require('../../../assets/imgs/btn_next_page.png'),
require('../../../assets/imgs/btn_next_page_dis.png')
],
[
require('../../../assets/imgs/btn_previous_page.png'),
require('../../../assets/imgs/btn_previous_page_dis.png')
],
[
require('../../../assets/imgs/btn_front_page.png'),
require('../../../assets/imgs/btn_front_page_dis.png')
],
],
control_arr:[0,0,0],
pod_arr: [],
pod_group: "",
from_log:'',
to_log:'',
process:0,
pod_group_arr: [
{
value: 1,
label: "jakdsj",
},
{
value: 2,
label: "容器1",
},
{
value: 3,
label: "容器2",
},
],
pod_group_arr: [],
temp_time:'',
download_flag:true,
data_arr: [
"1231231233",
"jhabshjdabshdbasjdhb",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsdiquhdiw",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
"iquhdiwqbdjkbaskjdbajsd",
],
data_arr: [],
logFilePosition:'',
referenceTimestamp:'',
offsetFrom:'',
offsetTo:'',
referenceLineNum:'',
filecontant:'',
now_app:'',
term:'',
conn_: null,
connected_: false,
connectSucceed_: false,
connectSucceedString_: "\u001b[",
connectionClosed_: false,
id: "",
token: ""
};
},
watch: {},
computed: {},
created() {},
created() {
if (this.$route.query.content == 0) {
this.get_pod_list()
this.get_now_pod()
}else{
this.get_contain_list()
this.pod = this.$route.query.container
this.now_app = this.$route.query.name
}
},
mounted() {
if (this.$route.query.content == 1) {
var _this = this
var term = new Terminal();
this.initTerm()
this.setinit()
}
},
methods: {
setinit: function() {
var urlParams = {
namespace: this.$route.params.namespace,
name: this.$route.params.name,
containers: this.$route.params.containers
};
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/pod/${this.$route.query.namespace}/${this.$route.query.name}/shell/${this.$route.query.container}`)
.then((response) => {
this.id = response.data.id;
if (this.id != undefined && this.id.length > 0) {
// 建立连接
this.setupConnection();
}
this.token = response.data.id;
})
},
initTerm() {
this.term = new Terminal({
// cols: 40,
// rows: 30,
fontSize: 14,
fontFamily: 'Consolas, "Courier New", monospace',
bellStyle: "sound",
cursorBlink: true
});
const fitAddon = new FitAddon();
term.loadAddon(fitAddon);
term.open(document.getElementById("xterm_contain"));
this.term.loadAddon(fitAddon);
this.term.open(document.getElementById("xterm_contain"));
fitAddon.fit();
var temp = ''
function runFakeTerminal() {
if (term._initialized) {
return;
}
window.addEventListener("resize", () => {
fitAddon.fit();
});
term._initialized = true;
this.term.onData(this.onTerminalSendString.bind(this));
// this.term.write('\u001b[');
this.term.onResize(this.onTerminalResize.bind(this));
// this.term.fit();
},
onTerminalSendString: function(key) {
var _this = this;
if (this.connected_) {
this.conn_.send(
JSON.stringify({
Op: "stdin",
Data: key,
Cols: this.term.cols,
Rows: this.term.rows
})
);
}
},
onTerminalResize: function() {
if (this.connected_) {
this.conn_.send(
JSON.stringify({
Op: "resize",
Cols: this.term.cols,
Rows: this.term.rows
})
);
}
},
setupConnection: function() {
var self = this;
this.conn_ = new SockJS(`/awecloud/proxy/wss/api/sockjs?${self.id}`);
this.conn_.onopen = function() {
var startData = { Op: "bind", SessionID: self.id };
self.conn_.send(JSON.stringify(startData));
self.connected_ = true;
// Make sure the terminal is with correct display size.
self.onTerminalResize();
term.prompt = () => {
term.write("\r\n$ ");
};
prompt(term,false);
// Focus on connection
};
this.conn_.onmessage = function(event) {
const msg = JSON.parse(event.data);
self.handleConnectionMessage(msg);
term.onKey((e) => {
const printable =
!e.domEvent.altKey &&
!e.domEvent.altGraphKey &&
!e.domEvent.ctrlKey &&
!e.domEvent.metaKey;
// console.log(msg)
// self.term.write(msg.Data);
};
this.conn_.onclose = this.onConnectionClose.bind(this);
},
if (e.domEvent.keyCode === 13) {
//enter
prompt(term);
} else if (e.domEvent.keyCode === 8) {
// Do not delete the prompt
if (term._core.buffer.x > 2) {
term.write("\b \b");
}
} else if (printable) {
term.write(e.key);
}
});
handleConnectionMessage: function(msg) {
var self = this;
if (msg.Op === "stdout") {
self.term.write(msg.Data);
}
},
onConnectionClose: function(event) {
if (!this.connected_) {
return;
}
this.conn_.close();
this.connected_ = false;
this.connectionClosed_ = true;
console.log("断开连接", event);
},
get_contain_list(){
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/pod/${this.$route.query.namespace}/${this.$route.query.name}/container`)
.then((response) => {
this.pod_arr = response.data.containers;
})
},
page(index,flag) {
if(flag==1){
return
}
if (index == 0) {
// 上一页
this.logFilePosition = "beginning";
this.referenceTimestamp = "oldest";
this.referenceLineNum = 0;
this.offsetFrom = -2000000100;
this.offsetTo = -2000000000;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
console.log("0");
} else if (index == 1) {
// 上移
this.referenceLineNum = -1;
console.log(this.offsetFrom);
this.offsetFrom = this.offsetFrom - 100;
this.offsetTo = this.offsetTo - 100;
console.log(this.offsetFrom);;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
console.log("1");
} else if (index == 2) {
// 下移
function prompt(term,val=true) {
// term.write("\r\n$ ");
if(val){
term.write("\r\n");
term.write(_this.getdata())
}
term.write("\r\n$ ");
// 现在
this.referenceLineNum = -1;
this.offsetFrom = this.offsetFrom + 100;
this.offsetTo = this.offsetTo + 100;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
console.log("2");
} else if (index == 3) {
// 下一页
this.logFilePosition = "end";
this.referenceTimestamp = "newest";
this.referenceLineNum = 0;
this.offsetFrom = 2000000000;
this.offsetTo = 2000000100;;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
console.log("3");
}
runFakeTerminal();
}
},
methods: {
},
get_pod_list(){
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/log/source/${this.$route.query.namespace}/${this.$route.query.name}/pod`)
.then((response) => {
console.log(response);
this.pod_arr = response.data.containerNames
this.pod_group_arr = response.data.podNames
})
},
get_now_pod(url){
var temp_url = `/awecloud/rest/kubernetes/api/v1/log/${this.$route.query.namespace}/${this.$route.query.name}/${this.$route.query.container}`
this.$http
.get(temp_url,{params:url})
.then((response) => {
console.log(response);
this.pod = response.data.info.containerName;
this.pod_group = response.data.info.podName;
this.from_log = helper.CreationDateDesc(response.data.info.fromDate);
this.to_log = helper.CreationDateDesc(response.data.info.toDate);
this.logFilePosition = response.data.selection.logFilePosition;
this.referenceTimestamp =
response.data.selection.referencePoint.timestamp;
this.offsetFrom = response.data.selection.offsetFrom;
this.offsetTo = response.data.selection.offsetTo;
this.data_arr = response.data.logs;
})
},
getdata(){
return '54555555'
},
......@@ -257,48 +389,90 @@ export default {
if(n==1){
if(this.control_arr[n]==1){
this.temp_time=setInterval(()=>{
this.data_arr = []
this.data_arr.push(this.getrecode(!this.control_arr[2]==1))
},1000)
this.logFilePosition = "end";
this.referenceTimestamp = "newest";
this.referenceLineNum = 0;
this.offsetFrom = 2000000000;
this.offsetTo = 2000000100;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
},10000)
}else{
if(this.temp_time){
clearInterval(this.temp_time)
}
clearInterval(this.temp_time)
}
}
if(n==2){
this.data_arr = []
if(this.control_arr[n]==1){
this.data_arr.push(this.getrecode(false))
this.logFilePosition = "end";
this.referenceTimestamp = "newest";
this.referenceLineNum = 0;
this.offsetFrom = 2000000000;
this.offsetTo = 2000000100;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
}else{
this.data_arr.push(this.getrecode())
this.logFilePosition = "end";
this.referenceTimestamp = "newest";
this.referenceLineNum = 0;
this.offsetFrom = 2000000000;
this.offsetTo = 2000000100;
this.get_now_pod({
logFilePosition: this.logFilePosition,
referenceTimestamp: this.referenceTimestamp,
referenceLineNum: this.referenceLineNum,
offsetFrom: this.offsetFrom,
offsetTo: this.offsetTo,
previous: this.control_arr[2]==1
});
}
}
},
getrecode(n=true){
if(n){
return '124123432423432324'
}else{
return '555555555555555'
}
},
download(){
var temp = setInterval(()=>{
this.process=this.process+1
this.process=this.process+4
if(this.process>=99){
clearInterval(temp)
this.process = 100
this.download_flag = false
}
},10)
},100)
this.$refs.actiondialog.show();
this.$http
.get(`/awecloud/rest/kubernetes/api/v1/log/file/${this.$route.query.namespace}/${this.$route.query.name}/${this.$route.query.container}?previous=${this.control_arr[2]==1}`)
.then((response) => {
if (response.status == 200) {
this.process = 100;
this.download_flag = false
clearInterval(temp)
this.filecontant = response.data;
}
})
},
format(n){
return ''
},
save_file(){
console.log('1111');
var filename = "logs-form-" + this.pod + "-" + this.pod_group;
var a = document.createElement("a");
var blob = new Blob([this.filecontant]);
a.download = filename;
a.href = URL.createObjectURL(blob);
a.click();
URL.revokeObjectURL(blob);
}
......@@ -411,6 +585,8 @@ background:khaki;
}
.code img {
float: right;
margin-right: 35px;
cursor: pointer;
}
.back {
width: 124px;
......
src/services/helper.js
View file @ 223cb2d2
......@@ -77,4 +77,11 @@ module.exports.numberFormat = function (num, decimals) {
} else {
return num;
}
}
module.exports.CreationDateDesc = function (timestamp) {
let date = new Date(timestamp);
return date.toLocaleDateString("zh-CN", {
timeZone: "Asia/Shanghai"
});
}
\ No newline at end of file
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