量测:页面显示调整

This commit is contained in:
高云鹏 2024-11-05 09:29:42 +08:00
parent f64b357a1a
commit 2bfb7458d1
2 changed files with 35 additions and 71 deletions

View File

@ -409,9 +409,7 @@ const initpowerChart = () => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
interval: 'auto',
//rotate: 45
},
@ -442,9 +440,7 @@ const initpowerChart = () => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
},
axisTick: { show: false },
splitLine: {
@ -472,9 +468,7 @@ const initpowerChart = () => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
},
axisTick: { show: false },
splitLine: {
@ -623,9 +617,7 @@ const initTrendChart = (type: 'day' | 'month') => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
},
splitLine: {
//线
@ -654,9 +646,7 @@ const initTrendChart = (type: 'day' | 'month') => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
},
axisTick: { show: false },
splitLine: {
@ -1403,7 +1393,7 @@ const sendManualCommand = (type: 1 | 0) => {
deviceId: route.query.irn as string,
serviceCode: 'Locked',
serviceName,
optDesc: serviceName +',设定值为:'+ type,
optDesc: serviceName + ',设定值为:' + type,
opValue: type,
}).then((res) => {
if (res.code == 200) {

View File

@ -11,8 +11,10 @@
:sortable="item.sortable"
>
<template #default="scope">
<div v-if="item.prop === 'realTimeValue'" class="realTimeValue" @click="openLineChart(scope.row)">
<el-button text type="primary">{{ scope.row.realTimeValue }}</el-button>
<div v-if="item.prop === 'realTimeValue'" class="realTimeValue">
<div class="realTimeValueText">{{ scope.row.realTimeValue }}</div>
</div>
<div v-if="item.prop === 'operate'" @click="openLineChart(scope.row)" class="operate">
<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="20px" height="20px" viewBox="0 0 1024 1024" version="1.1">
<path
d="M896 896H96a32 32 0 0 1-32-32V224a32 32 0 0 1 64 0v608h768a32 32 0 1 1 0 64zM247.008 640a32 32 0 0 1-20.992-56.192l200.992-174.24a32 32 0 0 1 42.272 0.288l172.128 153.44 229.088-246.304a32 32 0 0 1 46.88 43.616l-250.432 269.216a31.936 31.936 0 0 1-44.704 2.08l-174.56-155.52-179.744 155.84a31.872 31.872 0 0 1-20.928 7.776z"
@ -54,17 +56,13 @@
</el-form-item>
</div>
<div>
<el-form-item prop="interval" label="时间间隔:" style="margin-right: 2px">
<el-input v-model="seachOptions.interval" style="width: 100px" placeholder="请输入时间间隔"></el-input>
</el-form-item>
<el-form-item prop="unit">
<el-select v-model="seachOptions.unit" placeholder="请选择时间单位" style="width: 75px">
<el-option label="秒" value="s"></el-option>
<el-option label="分钟" value="m"></el-option>
<el-option label="小时" value="h"></el-option>
<el-option label="天" value="d"></el-option>
<el-option label="周" value="w"></el-option>
<el-option label="年" value="y"></el-option>
<el-form-item prop="interval" label="时间间隔:">
<el-select v-model="seachOptions.interval" placeholder="请选择时间间隔" style="width: 100px">
<el-option label="原始" value="40s"></el-option>
<el-option label="5分钟" value="5m"></el-option>
<el-option label="15分钟" value="15m"></el-option>
<el-option label="1小时" value="1h"></el-option>
<el-option label="1天" value="1d"></el-option>
</el-select>
</el-form-item>
</div>
@ -86,28 +84,6 @@ import { getModelAttributeListReq, getRealValueListReq } from '/@/api/backend/de
import * as echarts from 'echarts'
import { getRealValueRangeReq } from '/@/api/backend/deviceModel/request'
// const props = defineProps({
// iotModelId: {
// type: String,
// default: '',
// },
// deviceId: {
// type: String,
// default: '',
// },
// show: {
// type: Boolean,
// default: false,
// },
// autoUpdate: {
// type: Boolean,
// default: false,
// },
// attributeType: {
// type: Number,
// default: '138',
// },
// })
const props = withDefaults(
defineProps<{ iotModelId: string; deviceId: string; show: boolean; autoUpdate: boolean; attributeType: ModelAttributeType }>(),
{
@ -154,6 +130,13 @@ const tableColumn = [
align: 'center',
sortable: false,
},
{
label: '历史曲线',
prop: 'operate',
align: 'center',
width: 80,
sortable: false,
},
]
const tableData = ref<any[]>([])
@ -348,7 +331,7 @@ const getChartData = () => {
attributes: [searchInfo.attr],
},
],
interval: seachOptions.interval + seachOptions.unit,
interval: seachOptions.interval,
}).then((res) => {
initChart(res.data?.[props.deviceId]?.[searchInfo.attr])
})
@ -360,8 +343,7 @@ const chartRef = ref()
let chartInstance: any = null
const seachOptions = reactive({
datePickerValue: [0, 0],
interval: 5,
unit: 'm',
interval: '5m',
})
const searchRules = {
@ -384,18 +366,11 @@ const searchRules = {
trigger: 'input',
},
],
unit: [
{
required: true,
message: '请选择时间单位',
trigger: 'change',
},
],
}
const initChart = (data: { values: number[]; times: number[] }) => {
chartInstance && chartInstance.clear()
chartInstance = chartInstance ? chartInstance : echarts.init(chartRef.value)
const times = data?.times.map((item) => dayjs(item).format('YYYY-MM-DD HH:mm:ss'))
@ -426,9 +401,7 @@ const initChart = (data: { values: number[]; times: number[] }) => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
interval: 'auto',
//rotate: 45
},
@ -459,9 +432,7 @@ const initChart = (data: { values: number[]; times: number[] }) => {
axisLabel: {
//x
show: true,
textStyle: {
color: '#4E5969',
},
color: '#4E5969',
},
axisTick: { show: false },
splitLine: {
@ -511,13 +482,16 @@ watch(
</script>
<style scoped lang="scss">
.realTimeValue {
display: flex;
align-items: center;
.realTimeValueText {
color: #0064aa;
}
.operate {
&:hover {
cursor: pointer;
}
}
.searchPart {
width: 100%;
display: flex;