From f7f2ed929867ffc36bbc93c1e4f722c5720aa177 Mon Sep 17 00:00:00 2001 From: XieYongHong <18010623010@163.com> Date: Thu, 20 Jul 2023 11:39:34 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E8=AE=BE=E5=A4=87=E7=AE=A1=E7=90=86?= =?UTF-8?q?=E3=80=81=E8=BF=90=E7=BB=B4=E7=AE=A1=E7=90=86=E3=80=81=E5=91=8A?= =?UTF-8?q?=E8=AD=A6=E4=B8=AD=E5=BF=83=E4=BB=AA=E8=A1=A8=E7=9B=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DashBoard/components/TimeSelect.vue | 4 +- src/views/device/DashBoard/index.vue | 20 +++++++--- src/views/link/DashBoard/components/Cpu.vue | 39 +++++++++---------- src/views/link/DashBoard/components/Jvm.vue | 36 ++++++++--------- .../link/DashBoard/components/Network.vue | 18 +++++---- src/views/link/DashBoard/components/tool.ts | 18 ++++----- .../DashBoard/components/TimeSelect.vue | 2 + src/views/rule-engine/DashBoard/index.vue | 25 ++++++++---- 8 files changed, 91 insertions(+), 71 deletions(-) diff --git a/src/views/device/DashBoard/components/TimeSelect.vue b/src/views/device/DashBoard/components/TimeSelect.vue index 9a149466..71f7d0cc 100644 --- a/src/views/device/DashBoard/components/TimeSelect.vue +++ b/src/views/device/DashBoard/components/TimeSelect.vue @@ -82,11 +82,13 @@ const getTimeByType = (type: string) => { case 'hour': return dayjs().subtract(1, 'hours').valueOf(); case 'week': - return dayjs().subtract(6, 'days').valueOf(); + return dayjs().subtract(6, 'days').startOf('day').valueOf(); case 'month': return dayjs().subtract(29, 'days').valueOf(); case 'year': return dayjs().subtract(365, 'days').valueOf(); + case 'day': + return dayjs().subtract(24, 'hours').valueOf(); default: return dayjs().startOf('day').valueOf(); } diff --git a/src/views/device/DashBoard/index.vue b/src/views/device/DashBoard/index.vue index b0047d7a..5bf13060 100644 --- a/src/views/device/DashBoard/index.vue +++ b/src/views/device/DashBoard/index.vue @@ -42,6 +42,11 @@ + + 最近1小时 + + 最近24小时 + 近一周 + +
@@ -125,11 +121,11 @@ const echartsOptions = computed(() => { { type: 'inside', start: 0, - end: 100, + end: data.value.type !== 'hour' ? 5 : 100, }, { start: 0, - end: 100, + end: data.value.type !== 'hour' ? 5 : 100, }, ], color: ['#2CB6E0'], @@ -194,18 +190,19 @@ watch( if (value === undefined) return; const date = getTimeByType(value); data.value.time = [dayjs(date), dayjs(new Date())]; + if (props.isNoCommunity) { + getCPUEcharts(data.value); + } }, { immediate: true, deep: true }, ); -watchEffect(() => { - const time = data.value.time - if (time && Array.isArray(time) && time.length === 2 && time[0]) { - if (!props.isNoCommunity || props.serviceId) { - getCPUEcharts(data.value); - } - } -}) +// watchEffect(() => { +// const time = data.value.time +// if (time && Array.isArray(time) && time.length === 2 && time[0]) { +// +// } +// }) diff --git a/src/views/link/DashBoard/components/Jvm.vue b/src/views/link/DashBoard/components/Jvm.vue index 42eb4e9f..7da8f2cb 100644 --- a/src/views/link/DashBoard/components/Jvm.vue +++ b/src/views/link/DashBoard/components/Jvm.vue @@ -20,15 +20,11 @@ style="margin-right: 10px" v-model:value="data.type" > - - 最近1小时 - - - 今日 - - - 近一周 - + + 最近1小时 + + 最近24小时 + 近一周 @@ -180,11 +176,11 @@ const echartsOptions = computed(() => { { type: 'inside', start: 0, - end: 100, + end: data.value.type !== 'hour' ? 10 : 100, }, { start: 0, - end: 100, + end: data.value.type !== 'hour' ? 10 : 100, }, ], color: ['#60DFC7'], @@ -198,18 +194,20 @@ watch( if (value === undefined) return; const date = getTimeByType(value); data.value.time = [dayjs(date), dayjs(new Date())]; + + if (props.isNoCommunity) { + getJVMEcharts(data.value); + } }, { immediate: true, deep: true }, ); -watchEffect(() => { - const time = data.value.time - if (time && Array.isArray(time) && time.length === 2 && time[0]) { - if (!props.isNoCommunity || props.serviceId) { - getJVMEcharts(data.value); - } - } -}) +// watchEffect(() => { +// const time = data.value.time +// if (time && Array.isArray(time) && time.length === 2 && time[0]) { +// +// } +// }) diff --git a/src/views/link/DashBoard/components/Network.vue b/src/views/link/DashBoard/components/Network.vue index 35a8f4e6..e6c32143 100644 --- a/src/views/link/DashBoard/components/Network.vue +++ b/src/views/link/DashBoard/components/Network.vue @@ -26,7 +26,7 @@ 最近1小时 - 近24小时 + 最近24小时 近一周 { }, grid: { left: '70px', - right: 10, + right: data.value.time.type === 'week' ? 50 :10, bottom: '24px', top: 24 }, @@ -213,16 +213,18 @@ watch( if (value === undefined) return; const date = getTimeByType(value); data.value.time.time = [dayjs(date), dayjs(new Date())]; + + getNetworkEcharts(data.value); }, { immediate: true, deep: true }, ); -watchEffect(() => { - const time = data.value.time.time - if (time && Array.isArray(time) && time.length === 2 && time[0] && props.serviceId) { - getNetworkEcharts(data.value); - } -}) +// watchEffect(() => { +// const time = data.value.time.time +// if (time && Array.isArray(time) && time.length === 2 && time[0] && props.serviceId) { +// +// } +// }) diff --git a/src/views/link/DashBoard/components/tool.ts b/src/views/link/DashBoard/components/tool.ts index 846ed48a..4bcbac31 100644 --- a/src/views/link/DashBoard/components/tool.ts +++ b/src/views/link/DashBoard/components/tool.ts @@ -36,7 +36,7 @@ export const getTimeByType = (type: string) => { case 'hour': return dayjs().subtract(1, 'hours'); case 'week': - return dayjs().subtract(6, 'days'); + return dayjs().subtract(6, 'days').startOf('day'); case 'month': return dayjs().subtract(29, 'days'); case 'year': @@ -59,7 +59,7 @@ export const arrayReverse = (data: string) => { export const networkParams = (val: any) => { let _time = '1h'; let _limit = 12; - let format = 'HH'; + let format = 'M月dd日 HH:mm'; // @ts-ignore const dt = dayjs(val.time.time[1]) - dayjs(val.time.time[0]) const hour = 60 * 60 * 1000; @@ -68,17 +68,15 @@ export const networkParams = (val: any) => { const year = 365 * days; if (dt <= (hour + 10)) { - format = 'mm:ss'; - _time = '1m'; - _limit = 30; - } else if (dt > hour && dt <= days) { - _limit = Math.abs(Math.ceil(dt / hour)); - _limit = 24; format = 'HH:mm'; + _time = '1m'; + _limit = 60; + } else if (dt > hour && dt <= days) { + _limit = 24; } else if (dt > days && dt <= months * 3) { _limit = Math.abs(Math.ceil(dt / days)) + 1; _time = '1d'; - format = 'M月dd日'; + format = 'M月dd日 HH:mm:ss'; } else if (dt > months * 3 && dt < year) { _limit = Math.abs(Math.ceil(dt / months)) + 1; _time = '1M'; @@ -101,7 +99,7 @@ export const networkParams = (val: any) => { from: Number(val.time.time[0]), to: Number(val.time.time[1]), limit: _limit, - format: 'YYYY-MM-dd HH:mm', + format: format, }, }, ]; diff --git a/src/views/rule-engine/DashBoard/components/TimeSelect.vue b/src/views/rule-engine/DashBoard/components/TimeSelect.vue index 5bb29065..c0ca0a49 100644 --- a/src/views/rule-engine/DashBoard/components/TimeSelect.vue +++ b/src/views/rule-engine/DashBoard/components/TimeSelect.vue @@ -86,6 +86,8 @@ const getTimeByType = (type: string) => { return dayjs().subtract(29, 'days').valueOf(); case 'year': return dayjs().subtract(365, 'days').valueOf(); + case 'day': + return dayjs().subtract(24, 'hours').valueOf(); default: return dayjs().startOf('day').valueOf(); } diff --git a/src/views/rule-engine/DashBoard/index.vue b/src/views/rule-engine/DashBoard/index.vue index 0ad4f4a8..983b106c 100644 --- a/src/views/rule-engine/DashBoard/index.vue +++ b/src/views/rule-engine/DashBoard/index.vue @@ -42,6 +42,11 @@ @@ -238,6 +243,7 @@ const getDashBoard = () => { .filter((item) => item.group === '15day') .map((item) => item.data) .sort((a, b) => b.timestamp - a.timestamp); + state.fifteenOptions = { xAxis: { type: 'category', @@ -355,20 +361,25 @@ const initQueryTime = (data: any) => { selectChange(); }; const selectChange = () => { - let time = '1h'; - let format = 'HH'; + let time = '1m'; + let format = 'M月dd日 HH:mm'; let limit = 12; const dt = queryCodition.endTime - queryCodition.startTime; const hour = 60 * 60 * 1000; const day = hour * 24; const month = day * 30; const year = 365 * day; - if (dt <= day) { - limit = Math.abs(Math.ceil(dt / hour)); + + if (dt <= (hour + 10)) { + limit = 60 + format = 'HH:mm'; + } else if (dt > hour && dt <= day) { + time = '1h' + limit = 24; } else if (dt > day && dt < year) { limit = Math.abs(Math.ceil(dt / day)) + 1; time = '1d'; - format = 'M月dd日'; + format = 'M月dd日 HH:mm:ss'; } else if (dt >= year) { limit = Math.abs(Math.floor(dt / month)); time = '1M'; @@ -429,7 +440,7 @@ const selectChange = () => { .filter((item: any) => item.group === 'alarmTrend') .forEach((item: any) => { xData.push(item.data.timeString); - sData.push(item.data.value * 100000); + sData.push(item.data.value); }); const maxY = sData.sort((a,b)=>{ return b-a @@ -452,7 +463,7 @@ const selectChange = () => { grid: { top: '2%', bottom: '5%', - left: maxY < 1000 ? '40px' : maxY.toString().length * 10, + left: maxY < 1000 ? 50 : maxY.toString().length * 10, right: '48px', }, series: [