Browse Source

开机时间格式化,曲线优化

master
xh 4 days ago
parent
commit
8ea0d733ed
  1. 2
      web/src/components/Echart/src/Echart.vue
  2. 52
      web/src/views/HandDevice/Home/components/HistoricalCurve.vue

2
web/src/components/Echart/src/Echart.vue

@ -72,7 +72,7 @@ watch(
() => options.value,
(options) => {
if (echartRef) {
echartRef?.setOption(options,true)
echartRef?.setOption(options,false)
}
},
{

52
web/src/views/HandDevice/Home/components/HistoricalCurve.vue

@ -5,18 +5,33 @@
:before-close="handleClose"
:destroy-on-close="true"
resizable
size="480px"
size="600px"
class="drawer"
>
<template #header>
<h4
<!-- <h4
>{{ currentMarker?.name }}手持表
<span class="gasChemical">{{ currentMarker?.gasChemical }}检测</span></h4
>
> -->
<div class="flex items-center justify-between">
<div class="chart-title">{{ currentMarker?.name }}手持表 {{ currentMarker?.gasChemical }}检测 </div>
<div style="padding-right: 20px;">
<el-date-picker
v-model="gasDateTimeRange"
value-format="YYYY-MM-DD HH:mm:ss"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
@change="handleDateChange"
/>
</div>
</div>
</template>
<template #default>
<!-- <div> 数据统计截止{{ currentMarker?.timeStr }} </div> -->
<div>
<div class="flex items-center justify-between">
<!-- <div class="flex items-center justify-between">
<div class="chart-title"> {{ currentMarker?.gasChemical }}浓度与电量趋势 </div>
<div>
<el-date-picker
@ -29,14 +44,14 @@
@change="handleDateChange"
/>
</div>
</div>
<div v-if="drawer && !loading">
<Echart :options="gasLineOptions" :height="325" />
</div> -->
<div v-if="drawer && !loading" style="height: 100%;">
<Echart :options="gasLineOptions" height="100%" />
</div>
<!-- <div v-if="drawer && !loading">
<Echart :options="gasSigLineOptions" :height="325" />
</div> -->
</div>
<!-- <div>
<div class="flex items-center justify-between">
<div> 电量趋势 </div>
@ -74,6 +89,8 @@ import { tdengineApi, tdStruct } from '@/api/gas/tdengine/index'
import { EChartsOption } from 'echarts'
import Echart from '@/components/Echart/src/Echart.vue'
import { formatPast2 } from '@/utils/formatTime'
import { ElMessage } from 'element-plus'
import dayjs from 'dayjs'
@ -309,7 +326,7 @@ const gasLineOptions = computed<EChartsOption>(() => {
animationEasing: 'cubicInOut'
},
{
name: '内存占用',
name: '可用内存',
smooth: true,
type: 'line',
yAxisIndex: 1,
@ -327,7 +344,7 @@ const gasLineOptions = computed<EChartsOption>(() => {
}
},
{
name: '系统运行时间',
name: '开机时间',
smooth: true,
type: 'line',
yAxisIndex: 1,
@ -340,7 +357,7 @@ const gasLineOptions = computed<EChartsOption>(() => {
if (value === null || value === undefined || isNaN(value)) {
return '-'
}
return Number(value).toFixed(3) + '分钟' //
return formatPast2(Number(value) * 60 * 1000) //
}
}
}
@ -540,4 +557,15 @@ defineExpose({
color: #f59a23;
background-color: rgba(245, 154, 35, 0.09);
}
</style>
<style lang="scss">
.drawer {
.el-drawer__header {
margin-bottom: 12px;
}
.el-drawer__body{
padding: 0 10px;
}
}
</style>

Loading…
Cancel
Save