diff --git a/escheduler-ui/.env b/escheduler-ui/.env index d4dcd9f473..52ce563e9b 100644 --- a/escheduler-ui/.env +++ b/escheduler-ui/.env @@ -1,6 +1,6 @@ # 后端接口地址 -API_BASE = http://192.168.220.154:12345 +API_BASE = http://192.168.220.247:12345 # 本地开发如需ip访问项目把"#"号去掉 #DEV_HOST = 192.168.xx.xx diff --git a/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/gaugeOption.js b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/gaugeOption.js new file mode 100644 index 0000000000..46c26186a6 --- /dev/null +++ b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/gaugeOption.js @@ -0,0 +1,121 @@ +export default { + series: [ + { + type: 'gauge', + center: ['50%', '45%'], // 仪表位置 + radius: '80%', // 仪表大小 + startAngle: 200, // 开始角度 + endAngle: -20, // 结束角度 + axisLine: { + show: false, + lineStyle: { // 属性lineStyle控制线条样式 + color: [ + [ 0.5, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ // eslint-disable-line + offset: 1, + color: '#E75F25' // 50% 处的颜色 + }, { + offset: 0.8, + color: '#D9452C' // 40% 处的颜色 + }], false) ], // 100% 处的颜色 + [ 0.7, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{ // eslint-disable-line + offset: 1, + color: '#FFC539' // 70% 处的颜色 + }, { + offset: 0.8, + color: '#FE951E' // 66% 处的颜色 + }, { + offset: 0, + color: '#E75F25' // 50% 处的颜色 + }], false) ], + [ 0.9, new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ // eslint-disable-line + offset: 1, + color: '#C7DD6B' // 90% 处的颜色 + }, { + offset: 0.8, + color: '#FEEC49' // 86% 处的颜色 + }, { + offset: 0, + color: '#FFC539' // 70% 处的颜色 + }], false) ], + [1, new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { // eslint-disable-line + offset: 0.2, + color: '#1CAD52' // 92% 处的颜色 + }, { + offset: 0, + color: '#C7DD6B' // 90% 处的颜色 + }], false) ] + ], + width: 10 + } + }, + splitLine: { + show: false + }, + axisTick: { + show: false + }, + axisLabel: { + show: false + }, + pointer: { // 指针样式 + length: '45%' + }, + detail: { + show: false + } + }, + { + type: 'gauge', + center: ['50%', '45%'], // 默认全局居中 + radius: '70%', + startAngle: 200, + endAngle: -20, + axisLine: { + show: true, + lineStyle: { // 属性lineStyle控制线条样式 + color: [ // 表盘颜色 + [ 0.5, '#DA462C' ], // 0-50%处的颜色 + [ 0.7, '#FF9618' ], // 51%-70%处的颜色 + [ 0.9, '#FFED44' ], // 70%-90%处的颜色 + [ 1, '#20AE51' ]// 90%-100%处的颜色 + ], + width: 30// 表盘宽度 + } + }, + splitLine: { // 分割线样式(及10、20等长线样式) + length: 30, + lineStyle: { // 属性lineStyle控制线条样式 + width: 2 + } + }, + axisTick: { // 刻度线样式(及短线样式) + length: 20 + }, + axisLabel: { // 文字样式(及“10”、“20”等文字样式) + color: 'black', + distance: 5 // 文字离表盘的距离 + }, + detail: { + formatter: '{score|{value}%}', + offsetCenter: [0, '50%'], + backgroundColor: '#2D8BF0', + height: 30, + rich: { + score: { + color: 'white', + fontFamily: '微软雅黑', + fontSize: 32 + } + } + }, + data: [{ + value: 70, + label: { + textStyle: { + fontSize: 12 + } + } + }] + } + ] +} diff --git a/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/list.vue b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/list.vue index 5bc030c848..55649f1eec 100644 --- a/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/list.vue +++ b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/_source/list.vue @@ -7,25 +7,28 @@ {{$t('#')}} - {{$t('IP')}} + node - {{$t('Process Pid')}} + ip - {{$t('zk registration directory')}} + 模式 - {{$t('cpuUsage')}} + 连接数 - {{$t('memoryUsage')}} + watch数 - {{$t('Create Time')}} + 数据量 - {{$t('Last heartbeat time')}} + Sent/Received + + + 节点自检状态 @@ -34,22 +37,25 @@ - {{item.host}} + task1 - {{item.port}} + 192.11.1.1 - {{item.zkDirectory}} + 2222 - {{_rtResInfo(JSON.parse(item.resInfo)['cpuUsage'])}} + 3333 - {{_rtResInfo(JSON.parse(item.resInfo)['memoryUsage'])}} + 4444 - {{item.createTime | formatDate}} + 5555 - {{item.lastHeartbeatTime | formatDate}} + 6666 + + + 7777 @@ -70,9 +76,6 @@ list: Array }, methods: { - _rtResInfo (val) { - return (val * 100).toFixed(2) + ' %' - } } } diff --git a/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue index e9f9f2947f..d807b4d7f9 100644 --- a/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue +++ b/escheduler-ui/src/js/conf/home/pages/monitor/pages/servers/master.vue @@ -1,11 +1,129 @@