mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2024-11-10 17:13:30 +08:00
fix: 解决容器监控数据缓存的问题
This commit is contained in:
parent
aa608ff891
commit
95bc5cc902
3 changed files with 15 additions and 152 deletions
|
@ -9,7 +9,6 @@ import (
|
|||
"github.com/1Panel-dev/1Panel/backend/app/api/v1/helper"
|
||||
"github.com/1Panel-dev/1Panel/backend/constant"
|
||||
"github.com/1Panel-dev/1Panel/backend/global"
|
||||
"github.com/1Panel-dev/1Panel/backend/utils/cmd"
|
||||
"github.com/1Panel-dev/1Panel/backend/utils/copier"
|
||||
"github.com/1Panel-dev/1Panel/backend/utils/ssh"
|
||||
"github.com/1Panel-dev/1Panel/backend/utils/terminal"
|
||||
|
@ -157,15 +156,6 @@ func (b *BaseApi) ContainerWsSsh(c *gin.Context) {
|
|||
}
|
||||
defer wsConn.Close()
|
||||
|
||||
cmds := fmt.Sprintf("docker exec %s %s", containerID, command)
|
||||
if len(user) != 0 {
|
||||
cmds = fmt.Sprintf("docker exec -u %s %s %s", user, containerID, command)
|
||||
}
|
||||
stdout, err := cmd.Exec(cmds)
|
||||
if wshandleError(wsConn, errors.WithMessage(err, stdout)) {
|
||||
return
|
||||
}
|
||||
|
||||
commands := fmt.Sprintf("docker exec -it %s %s", containerID, command)
|
||||
if len(user) != 0 {
|
||||
commands = fmt.Sprintf("docker exec -it -u %s %s %s", user, containerID, command)
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
<template>
|
||||
<el-drawer v-model="monitorVisiable" :destroy-on-close="true" :close-on-click-modal="false" size="50%">
|
||||
<el-drawer
|
||||
v-model="monitorVisiable"
|
||||
:destroy-on-close="true"
|
||||
@close="handleClose"
|
||||
:close-on-click-modal="false"
|
||||
size="50%"
|
||||
>
|
||||
<template #header>
|
||||
<DrawerHeader :header="$t('container.monitor')" :back="handleClose" />
|
||||
</template>
|
||||
|
@ -23,7 +29,6 @@
|
|||
:option="chartsOption['cpuChart']"
|
||||
v-if="chartsOption['cpuChart']"
|
||||
/>
|
||||
<!-- <div id="cpuChart" style="width: 100%; height: 200px"></div> -->
|
||||
</el-card>
|
||||
<el-card style="margin-top: 10px">
|
||||
<v-charts
|
||||
|
@ -33,7 +38,6 @@
|
|||
:option="chartsOption['memoryChart']"
|
||||
v-if="chartsOption['memoryChart']"
|
||||
/>
|
||||
<!-- <div id="memoryChart" style="width: 100%; height: 200px"></div> -->
|
||||
</el-card>
|
||||
<el-card style="margin-top: 10px">
|
||||
<v-charts
|
||||
|
@ -43,7 +47,6 @@
|
|||
:option="chartsOption['ioChart']"
|
||||
v-if="chartsOption['ioChart']"
|
||||
/>
|
||||
<!-- <div id="ioChart" style="width: 100%; height: 200px"></div> -->
|
||||
</el-card>
|
||||
<el-card style="margin-top: 10px">
|
||||
<v-charts
|
||||
|
@ -53,7 +56,6 @@
|
|||
:option="chartsOption['networkChart']"
|
||||
v-if="chartsOption['networkChart']"
|
||||
/>
|
||||
<!-- <div id="networkChart" style="width: 100%; height: 200px"></div> -->
|
||||
</el-card>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
@ -78,12 +80,6 @@ const dialogData = ref<DialogProps>({
|
|||
containerID: '',
|
||||
});
|
||||
|
||||
// function changeChartSize() {
|
||||
// echarts.getInstanceByDom(document.getElementById('cpuChart') as HTMLElement)?.resize();
|
||||
// echarts.getInstanceByDom(document.getElementById('memoryChart') as HTMLElement)?.resize();
|
||||
// echarts.getInstanceByDom(document.getElementById('ioChart') as HTMLElement)?.resize();
|
||||
// echarts.getInstanceByDom(document.getElementById('networkChart') as HTMLElement)?.resize();
|
||||
// }
|
||||
const acceptParams = async (params: DialogProps): Promise<void> => {
|
||||
monitorVisiable.value = true;
|
||||
dialogData.value.containerID = params.containerID;
|
||||
|
@ -98,7 +94,6 @@ const acceptParams = async (params: DialogProps): Promise<void> => {
|
|||
timeInterval.value = 5;
|
||||
isInit.value = true;
|
||||
loadData();
|
||||
// window.addEventListener('resize', changeChartSize);
|
||||
timer = setInterval(async () => {
|
||||
if (monitorVisiable.value) {
|
||||
isInit.value = false;
|
||||
|
@ -220,140 +215,12 @@ const loadData = async () => {
|
|||
],
|
||||
formatStr: 'KB/s',
|
||||
};
|
||||
// let cpuYDatas = {
|
||||
// name: 'CPU',
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: cpuDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// freshChart('cpuChart', ['CPU'], timeDatas.value, [cpuYDatas], 'CPU', '%');
|
||||
|
||||
// let memoryYDatas = {
|
||||
// name: i18n.global.t('monitor.memory'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: memDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// let cacheYDatas = {
|
||||
// name: i18n.global.t('container.cache'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: cacheDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// freshChart(
|
||||
// 'memoryChart',
|
||||
// [i18n.global.t('monitor.memory'), i18n.global.t('monitor.cache')],
|
||||
// timeDatas.value,
|
||||
// [memoryYDatas, cacheYDatas],
|
||||
// i18n.global.t('monitor.memory'),
|
||||
// ' MB',
|
||||
// );
|
||||
|
||||
// let ioReadYDatas = {
|
||||
// name: i18n.global.t('monitor.read'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: ioReadDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// let ioWriteYDatas = {
|
||||
// name: i18n.global.t('monitor.write'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: ioWriteDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// freshChart(
|
||||
// 'ioChart',
|
||||
// [i18n.global.t('monitor.read'), i18n.global.t('monitor.write')],
|
||||
// timeDatas.value,
|
||||
// [ioReadYDatas, ioWriteYDatas],
|
||||
// i18n.global.t('monitor.disk') + ' IO',
|
||||
// 'MB',
|
||||
// );
|
||||
|
||||
// let netTxYDatas = {
|
||||
// name: i18n.global.t('monitor.up'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: netTxDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// let netRxYDatas = {
|
||||
// name: i18n.global.t('monitor.down'),
|
||||
// type: 'line',
|
||||
// areaStyle: {
|
||||
// color: '#ebdee3',
|
||||
// },
|
||||
// data: netRxDatas.value,
|
||||
// showSymbol: false,
|
||||
// };
|
||||
// freshChart(
|
||||
// 'networkChart',
|
||||
// [i18n.global.t('monitor.up'), i18n.global.t('monitor.down')],
|
||||
// timeDatas.value,
|
||||
// [netTxYDatas, netRxYDatas],
|
||||
// i18n.global.t('monitor.network'),
|
||||
// 'KB/s',
|
||||
// );
|
||||
};
|
||||
|
||||
// function freshChart(chartName: string, legendDatas: any, xDatas: any, yDatas: any, yTitle: string, formatStr: string) {
|
||||
// if (isInit.value) {
|
||||
// echarts.init(document.getElementById(chartName) as HTMLElement);
|
||||
// }
|
||||
// let itemChart = echarts.getInstanceByDom(document.getElementById(chartName) as HTMLElement);
|
||||
// const option = {
|
||||
// title: [
|
||||
// {
|
||||
// left: 'center',
|
||||
// text: yTitle,
|
||||
// },
|
||||
// ],
|
||||
// zlevel: 1,
|
||||
// z: 1,
|
||||
// tooltip: {
|
||||
// trigger: 'axis',
|
||||
// formatter: function (datas: any) {
|
||||
// let res = datas[0].name + '<br/>';
|
||||
// for (const item of datas) {
|
||||
// res += item.marker + ' ' + item.seriesName + ':' + item.data + formatStr + '<br/>';
|
||||
// }
|
||||
// return res;
|
||||
// },
|
||||
// },
|
||||
// grid: { left: '7%', right: '7%', bottom: '20%' },
|
||||
// legend: {
|
||||
// data: legendDatas,
|
||||
// right: 10,
|
||||
// },
|
||||
// xAxis: { data: xDatas, boundaryGap: false },
|
||||
// yAxis: { name: '( ' + formatStr + ' )' },
|
||||
// series: yDatas,
|
||||
// };
|
||||
// itemChart?.setOption(option, true);
|
||||
// }
|
||||
|
||||
const handleClose = async () => {
|
||||
monitorVisiable.value = false;
|
||||
clearInterval(Number(timer));
|
||||
timer = null;
|
||||
// window.removeEventListener('resize', changeChartSize);
|
||||
chartsOption.value = { cpuChart: null, memoryChart: null, ioChart: null, networkChart: null };
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
<template>
|
||||
<el-drawer v-model="terminalVisiable" :destroy-on-close="true" :close-on-click-modal="false" size="50%">
|
||||
<el-drawer
|
||||
v-model="terminalVisiable"
|
||||
@close="handleClose"
|
||||
:destroy-on-close="true"
|
||||
:close-on-click-modal="false"
|
||||
size="50%"
|
||||
>
|
||||
<template #header>
|
||||
<DrawerHeader :header="$t('container.containerTerminal')" :back="handleClose" />
|
||||
</template>
|
||||
|
|
Loading…
Reference in a new issue