Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加mqtt链接展示

Browse Source
This commit is contained in:
GGJ
2025-04-28 15:51:30 +08:00
parent adc9b5a955
commit 9538b69310
4 changed files with 211 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/echarts/MyEchart.vue
View File

@@ -13,8 +13,6 @@ import 'echarts-liquidfill'
import 'echarts/lib/component/dataZoom'
import { color, gradeColor3 } from './color'
import { useConfig } from '@/stores/config'
import { saveAs } from 'file-saver'
import { t } from 'vxe-table'
// import { nextTick } from 'process'
const config = useConfig()
@@ -119,7 +117,15 @@ const initChart = () => {
height: 13,
bottom: '20px',
end: 100
}
},
// {
// show: true,
// yAxisIndex: 0,
// width: 12,
// handleSize: 8,
// showDataShadow: false,
// right: 12
// }
],
color: props.options?.color || color,
series: props.options?.series,
@@ -177,7 +183,7 @@ const handlerYAxis = () => {
color: '#000',
fontSize: 14,
formatter: function (value) {
return value.toFixed(0) // 格式化显示为一位小数
return parseFloat(value.toFixed(1)) // 格式化显示为一位小数
}
},
splitLine: {
@@ -217,9 +223,9 @@ const handlerXAxis = () => {
// textStyle: {
fontFamily: 'dinproRegular',
color: '#000',
fontSize: '12',
fontSize: '12'
// }
},
}
// boundaryGap: false,
}
// props.options?.xAxis 是数组还是对象

92
src/components/table/fieldRender/index.vue
View File

@@ -3,14 +3,27 @@
<Icon class="ba-icon-dark" v-if="field.render == 'icon'" :name="fieldValue ? fieldValue : field.default ?? ''" />
<!-- switch -->
<el-switch v-if="field.render == 'switch'" @change="onChangeField(field, $event)"
:model-value="fieldValue.toString()" :loading="row.loading" inline-prompt :active-value="field.activeValue"
:active-text="field.activeText" :inactive-value="field.inactiveValue" :inactive-text="field.inactiveText" />
<div v-if="field.render == 'switch' && fieldValue != undefined">
<el-switch
@change="onChangeField(field, $event)"
:model-value="fieldValue.toString()"
:loading="row.loading"
inline-prompt
:active-value="field.activeValue"
:active-text="field.activeText"
:inactive-value="field.inactiveValue"
:inactive-text="field.inactiveText"
/>
</div>
<!-- image -->
<div v-if="field.render == 'image' && fieldValue" class="ba-render-image">
<el-image :hide-on-click-modal="true" :preview-teleported="true" :preview-src-list="[fullUrl(fieldValue)]"
:src="fieldValue.length > 100 ? fieldValue : fullUrl(fieldValue)"></el-image>
<el-image
:hide-on-click-modal="true"
:preview-teleported="true"
:preview-src-list="[fullUrl(fieldValue)]"
:src="fieldValue.length > 100 ? fieldValue : fullUrl(fieldValue)"
></el-image>
</div>
<!-- tag -->
@@ -31,29 +44,55 @@
</div>
<!-- customTemplate 自定义模板 -->
<div v-if="field.render == 'customTemplate'"
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"></div>
<div
v-if="field.render == 'customTemplate'"
v-html="field.customTemplate ? field.customTemplate(row, field, fieldValue, column, index) : ''"
></div>
<!-- 自定义组件/函数渲染 -->
<component v-if="field.render == 'customRender'" :is="field.customRender" :renderRow="row" :renderField="field"
:renderValue="fieldValue" :renderColumn="column" :renderIndex="index" />
<component
v-if="field.render == 'customRender'"
:is="field.customRender"
:renderRow="row"
:renderField="field"
:renderValue="fieldValue"
:renderColumn="column"
:renderIndex="index"
/>
<!-- 按钮组 -->
<div v-if="field.render == 'buttons' && buttons" class="cn-render-buttons">
<template v-for="(btn, idx) in buttons" :key="idx">
<!-- 常规按钮 -->
<el-button link v-if="btn.render == 'basicButton'" @click="onButtonClick(btn)" :class="btn.class"
class="table-operate" :type="btn.type" :loading="props.row[btn.loading] || props.row.loading || false"
v-bind="btn.attr">
<el-button
link
v-if="btn.render == 'basicButton'"
@click="onButtonClick(btn)"
:class="btn.class"
class="table-operate"
:type="btn.type"
:loading="props.row[btn.loading] || props.row.loading || false"
v-bind="btn.attr"
>
<div v-if="btn.text || btn.title" class="table-operate-text">{{ btn.text || btn.title }}</div>
</el-button>
<!-- 带提示信息的按钮 -->
<el-tooltip v-if="btn.render == 'tipButton'" :disabled="btn.title && !btn.disabledTip ? false : true"
:content="btn.title" placement="top">
<el-button link @click="onButtonClick(btn)" :class="btn.class" class="table-operate" :type="btn.type"
v-bind="btn.attr">
<el-tooltip
v-if="btn.render == 'tipButton'"
:disabled="btn.title && !btn.disabledTip ? false : true"
:content="btn.title"
placement="top"
>
<el-button
link
@click="onButtonClick(btn)"
:class="btn.class"
class="table-operate"
:type="btn.type"
v-bind="btn.attr"
>
<div v-if="btn.text || btn.title" class="table-operate-text">
{{ btn.text || btn.title }}
</div>
@@ -61,8 +100,12 @@
</el-tooltip>
<!-- 带确认框的按钮 -->
<el-popconfirm v-if="btn.render == 'confirmButton'" :disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.popconfirm" @confirm="onButtonClick(btn)">
<el-popconfirm
v-if="btn.render == 'confirmButton'"
:disabled="btn.disabled && btn.disabled(row, field)"
v-bind="btn.popconfirm"
@confirm="onButtonClick(btn)"
>
<template #reference>
<div style="display: inline-block">
<el-button link :class="btn.class" class="table-operate" :type="btn.type" v-bind="btn.attr">
@@ -80,9 +123,14 @@
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="item in btn.buttons" :key="item.text" :command="item" :style="{
color: item.type === 'primary' ? 'var(--el-color-primary)' : 'var(--el-color-danger'
}">
<el-dropdown-item
v-for="item in btn.buttons"
:key="item.text"
:command="item"
:style="{
color: item.type === 'primary' ? 'var(--el-color-primary)' : 'var(--el-color-danger'
}"
>
{{ item.text }}
</el-dropdown-item>
</el-dropdown-menu>
@@ -230,7 +278,7 @@ const handlerCommand = (item: OptButton) => {
margin-left: 6px;
}
.ml-6+.el-button {
.ml-6 + .el-button {
margin-left: 6px;
}

137
src/utils/echartMethod.ts
View File

@@ -4,8 +4,50 @@ const dataProcessing = (arr: any[]) => {
.map(item => (typeof item === 'number' ? item : parseFloat(item)))
}
const calculateValue = (o:number,value: number, num: number, isMin: boolean) => {
if (value === 0) {
return 0
}else if(value>0&& Math.abs(value)<1 && isMin==true){
return 0
}else if(value>-1&& value<0 && isMin==false){
return 0
}
let base
if (Math.abs(o) >= 100) {
base = 100
} else if (Math.abs(o) >= 10) {
base = 10
} else if (Math.abs(o) >= 1) {
base = 1
} else {
base = 0.1
}
let calculatedValue
if (isMin) {
if (value < 0) {
calculatedValue = value + num * value
} else {
calculatedValue = value - num * value
}
} else {
if (value < 0) {
calculatedValue = value - num * value
} else {
calculatedValue = value + num * value
}
}
if (base === 0.1) {
return parseFloat(calculatedValue.toFixed(1))
} else if (isMin) {
return Math.floor(calculatedValue / base) * base
} else {
return Math.ceil(calculatedValue / base) * base
}
}
// 处理y轴最大最小值
export const yMethod = (arr: any) => {
let num = 0.2
let numList = dataProcessing(arr)
let maxValue = 0
let minValue = 0
@@ -13,35 +55,80 @@ export const yMethod = (arr: any) => {
let min = 0
maxValue = Math.max(...numList)
minValue = Math.min(...numList)
if (maxValue > 1000 || minValue < -1000) {
max = Math.ceil(maxValue / 100) * 100
if (minValue == 0) {
min = 0
} else {
min = Math.floor(minValue / 100) * 100
}
} else if (maxValue < 60 && minValue > 40) {
max = 60
min = 40
} else if (maxValue == minValue && maxValue < 10 && minValue > 0) {
max = Math.ceil(maxValue / 10) * 10
min = Math.floor(minValue / 10) * 10
} else if (maxValue == minValue && maxValue != 0 && minValue != 0) {
max = Math.ceil(maxValue / 10 + 1) * 10
min = Math.floor(minValue / 10 - 1) * 10
} else {
max = Math.ceil(maxValue / 10) * 10
min = Math.floor(minValue / 10) * 10
}
const o=maxValue-minValue
min = calculateValue( o,minValue, num, true)
max = calculateValue(o,maxValue, num, false)
// if (-100 >= minValue) {
// min = Math.floor((minValue + num * minValue) / 100) * 100
// } else if (-10 >= minValue && minValue > -100) {
// min = Math.floor((minValue + num * minValue) / 10) * 10
// } else if (-1 >= minValue && minValue > -10) {
// min = Math.floor(minValue + num * minValue)
// } else if (0 > minValue && minValue > -1) {
// min = parseFloat((minValue + num * minValue).toFixed(1))
// } else if (minValue == 0) {
// min = 0
// } else if (0 < minValue && minValue < 1) {
// min = parseFloat((minValue - num * minValue).toFixed(1))
// } else if (1 <= minValue && minValue < 10) {
// min = Math.floor(minValue - num * minValue)
// } else if (10 <= minValue && minValue < 100) {
// min = Math.floor((minValue - num * minValue) / 10) * 10
// } else if (100 <= minValue) {
// min = Math.floor((minValue - num * minValue) / 100) * 100
// }
// if (-100 >= maxValue) {
// max = Math.ceil((maxValue - num * maxValue) / 100) * 100
// } else if (-10 >= maxValue && maxValue > -100) {
// max = Math.ceil((maxValue - num * maxValue) / 10) * 10
// } else if (-1 >= maxValue && maxValue > -10) {
// max = Math.ceil(maxValue - num * maxValue)
// } else if (0 > maxValue && maxValue > -1) {
// max = parseFloat((maxValue - num * maxValue).toFixed(1))
// } else if (maxValue == 0) {
// max = 0
// } else if (0 < maxValue && maxValue < 1) {
// max = parseFloat((maxValue + num * maxValue).toFixed(1))
// } else if (1 <= maxValue && maxValue < 10) {
// max = Math.ceil(maxValue + num * maxValue)
// } else if (10 <= maxValue && maxValue < 100) {
// max = Math.ceil((maxValue + num * maxValue) / 10) * 10
// } else if (100 <= maxValue) {
// max = Math.ceil((maxValue + num * maxValue) / 100) * 100
// }
// if (maxValue > 1000 || minValue < -1000) {
// max = Math.ceil(maxValue / 100) * 100
// if (minValue == 0) {
// min = 0
// } else {
// min = Math.floor(minValue / 100) * 100
// }
// } else if (maxValue < 60 && minValue > 40) {
// max = 60
// min = 40
// } else if (maxValue == minValue && maxValue < 10 && minValue > 0) {
// max = Math.ceil(maxValue / 10) * 10
// min = Math.floor(minValue / 10) * 10
// } else if (maxValue == minValue && maxValue != 0 && minValue != 0) {
// max = Math.ceil(maxValue / 10 + 1) * 10
// min = Math.floor(minValue / 10 - 1) * 10
// } else {
// max = Math.ceil(maxValue / 10) * 10
// min = Math.floor(minValue / 10) * 10
// }
// if (maxValue > 0 && maxValue < 1) {
// max = 1
// } else if (max == 0 && minValue > -1 && minValue < 0) {
// min = -1
// }
if (maxValue > 0 && maxValue < 1) {
max = 1
} else if (max == 0 && minValue > -1 && minValue < 0) {
min = -1
}
return [min, max]
}
/**
* title['A相','B相',]
* data[[1,2],[3,4]]

27
src/views/govern/manage/factory.vue
View File

@@ -283,6 +283,7 @@ const tableStore = new TableStore({
},
{ title: '设备名称', field: 'name' },
{ title: '网络设备ID', field: 'ndid' },
{
title: '设备类型',
field: 'devType',
@@ -305,7 +306,7 @@ const tableStore = new TableStore({
return row.cellValue === 'MQTT' ? 'MQTT' : row.cellValue === 'CLD' ? 'CLD' : row.cellValue
}
},
{ title: '录入时间', field: 'createTime',sortable: true },
{ title: '录入时间', field: 'createTime', sortable: true },
{
title: '使用状态',
@@ -352,6 +353,21 @@ const tableStore = new TableStore({
})
}
},
// { title: 'MQTT状态', field: 'connectStatus', width: 100, },
{
title: 'MQTT状态',
field: 'connectStatus',
width: 100,
render: 'tag',
custom: {
未连接: 'danger',
已连接: 'success'
},
replaceValue: {
未连接: '未连接',
已连接: '已连接'
}
},
{
title: '通讯状态',
field: 'runStatus',
@@ -360,20 +376,11 @@ const tableStore = new TableStore({
custom: {
1: 'danger',
2: 'success'
// 3: 'primary',
// 4: 'primary',
// 5: 'warning'
},
replaceValue: {
1: '离线',
2: '在线'
// 3: '接入',
// 4: '已取消',
// 5: '未接入'
}
// formatter: row => {
// return row.cellValue == 1 ? '未注册' : row.cellValue == 2 ? '注册' : '接入'
// },
},
{