Commit eb141885c23507bc1dac7aa748a64e769cd175f0

Authored by ww
1 parent 7bb8bcd5

fix: 修复仪表盘无法设置单位

dist.zip deleted 100644 → 0
No preview for this file type
1 -export const defaultOption = {  
2 - series: [{  
3 - type: 'gauge',  
4 - min: 0,  
5 - max: 100,  
6 - startAngle: 200, // 仪表盘起始角度  
7 - endAngle: -20, // 仪表盘结束角度  
8 - radius: '85%',  
9 - progress: {  
10 - show: true,  
11 - width: 15,  
12 - },  
13 - axisLine: {  
14 - lineStyle: { 1 +export const getDefaultOption = (unit: string = '℃') => {
  2 + return {
  3 + series: [{
  4 + type: 'gauge',
  5 + min: 0,
  6 + max: 100,
  7 + startAngle: 200, // 仪表盘起始角度
  8 + endAngle: -20, // 仪表盘结束角度
  9 + radius: '85%',
  10 + progress: {
  11 + show: true,
15 width: 15, 12 width: 15,
16 }, 13 },
17 - },  
18 - axisTick: { // 是否显示刻度  
19 - show: true,  
20 - distance: 2,  
21 - },  
22 - splitLine: { // 分割线  
23 - length: 8,  
24 - show: true,  
25 - distance: 2,  
26 - lineStyle: {  
27 - width: 2,  
28 - },  
29 - },  
30 - pointer: { // 指针  
31 - show: false,  
32 - },  
33 - axisLabel: {  
34 - distance: 18,  
35 - color: '#999',  
36 - fontSize: 14,  
37 - },  
38 - title: {  
39 - show: false,  
40 - },  
41 - detail: {  
42 - valueAnimation: true,  
43 - fontSize: 17,  
44 - offsetCenter: [0, 0],  
45 - formatter: '{value} ℃',  
46 - color: 'inherit',  
47 - },  
48 - data: [  
49 - {  
50 - value: 70,  
51 - },  
52 - ],  
53 - }], 14 + axisLine: {
  15 + lineStyle: {
  16 + width: 15,
  17 + },
  18 + },
  19 + axisTick: { // 是否显示刻度
  20 + show: true,
  21 + distance: 2,
  22 + },
  23 + splitLine: { // 分割线
  24 + length: 8,
  25 + show: true,
  26 + distance: 2,
  27 + lineStyle: {
  28 + width: 2,
  29 + },
  30 + },
  31 + pointer: { // 指针
  32 + show: false,
  33 + },
  34 + axisLabel: {
  35 + distance: 18,
  36 + color: '#999',
  37 + fontSize: 14,
  38 + },
  39 + title: {
  40 + show: false,
  41 + },
  42 + detail: {
  43 + valueAnimation: true,
  44 + fontSize: 17,
  45 + offsetCenter: [0, 0],
  46 + formatter: `{value} ${unit}`,
  47 + color: 'inherit',
  48 + },
  49 + data: [
  50 + {
  51 + value: 70,
  52 + },
  53 + ],
  54 + }],
  55 + }
54 } 56 }
55 -  
@@ -2,13 +2,14 @@ @@ -2,13 +2,14 @@
2 import { computed, onMounted, ref, unref } from 'vue' 2 import { computed, onMounted, ref, unref } from 'vue'
3 import { init } from 'echarts' 3 import { init } from 'echarts'
4 import type { ECharts, EChartsOption } from 'echarts' 4 import type { ECharts, EChartsOption } from 'echarts'
5 -import { defaultOption } from './index.config' 5 +import { getDefaultOption } from './index.config'
6 import type { CreateComponentType, RenderComponentExposeType } from '@/core/Library/types' 6 import type { CreateComponentType, RenderComponentExposeType } from '@/core/Library/types'
7 import { useLatestMessageValue } from '@/core/Library/hook/useLatestMessageValue' 7 import { useLatestMessageValue } from '@/core/Library/hook/useLatestMessageValue'
8 import { useOnMessage } from '@/core/Library/hook/useOnMessage' 8 import { useOnMessage } from '@/core/Library/hook/useOnMessage'
9 import type { CommandSource } from '@/core/websocket/processor' 9 import type { CommandSource } from '@/core/websocket/processor'
10 import type { NodeDataDataSourceJsonType } from '@/api/node/model' 10 import type { NodeDataDataSourceJsonType } from '@/api/node/model'
11 import type { SubscriptionUpdateMsg } from '@/core/websocket/type/message' 11 import type { SubscriptionUpdateMsg } from '@/core/websocket/type/message'
  12 +import { useContentDataStore } from '@/store/modules/contentData'
12 13
13 const props = defineProps<{ 14 const props = defineProps<{
14 config: CreateComponentType 15 config: CreateComponentType
@@ -20,9 +21,13 @@ const chartElRef = ref<Nullable<HTMLDivElement>>() @@ -20,9 +21,13 @@ const chartElRef = ref<Nullable<HTMLDivElement>>()
20 21
21 const chartInstance = ref<Nullable<ECharts>>() 22 const chartInstance = ref<Nullable<ECharts>>()
22 23
  24 +const contentDataStore = useContentDataStore()
  25 +
23 function initChartInstance() { 26 function initChartInstance() {
24 chartInstance.value = init(unref(chartElRef)) 27 chartInstance.value = init(unref(chartElRef))
25 - chartInstance.value.setOption(defaultOption) 28 + const currentNodeData = unref(contentDataStore.getCurrentNodeDataById(props.config))
  29 +
  30 + chartInstance.value.setOption(getDefaultOption(currentNodeData?.dataSourceJson.chartOption?.unit))
26 } 31 }
27 32
28 onMounted(() => { 33 onMounted(() => {
@@ -3,6 +3,7 @@ import { toRaw, unref } from 'vue' @@ -3,6 +3,7 @@ import { toRaw, unref } from 'vue'
3 import { store } from '..' 3 import { store } from '..'
4 import type { NodeDataType } from '@/api/node/model' 4 import type { NodeDataType } from '@/api/node/model'
5 import type { ProductAndDevice } from '@/api/content/model' 5 import type { ProductAndDevice } from '@/api/content/model'
  6 +import type { CreateComponentType } from '@/core/Library/types'
6 7
7 interface DeviceList { 8 interface DeviceList {
8 deviceId: string 9 deviceId: string
@@ -13,7 +14,6 @@ interface DeviceList { @@ -13,7 +14,6 @@ interface DeviceList {
13 interface ContentDataStoreType { 14 interface ContentDataStoreType {
14 contentData: NodeDataType[] 15 contentData: NodeDataType[]
15 configurationId: Nullable<string> 16 configurationId: Nullable<string>
16 - currentNodeData: Nullable<Recordable>  
17 productAndDevice: ProductAndDevice[] 17 productAndDevice: ProductAndDevice[]
18 isTemplate?: number | null | string 18 isTemplate?: number | null | string
19 configurationContentList?: any 19 configurationContentList?: any
@@ -25,7 +25,6 @@ export const useContentDataStore = defineStore('app-content-data', { @@ -25,7 +25,6 @@ export const useContentDataStore = defineStore('app-content-data', {
25 state: (): ContentDataStoreType => ({ 25 state: (): ContentDataStoreType => ({
26 contentData: [], 26 contentData: [],
27 configurationId: null, 27 configurationId: null,
28 - currentNodeData: null,  
29 isTemplate: null, 28 isTemplate: null,
30 productAndDevice: [], 29 productAndDevice: [],
31 configurationContentList: [], 30 configurationContentList: [],
@@ -66,7 +65,14 @@ export const useContentDataStore = defineStore('app-content-data', { @@ -66,7 +65,14 @@ export const useContentDataStore = defineStore('app-content-data', {
66 const list = this.productAndDevice.map(item => toRaw(unref(item.deviceList))).flat(1) 65 const list = this.productAndDevice.map(item => toRaw(unref(item.deviceList))).flat(1)
67 this.diveceDetailMap = list.reduce((prev, next) => { 66 this.diveceDetailMap = list.reduce((prev, next) => {
68 return { ...prev, [next?.deviceId]: next } 67 return { ...prev, [next?.deviceId]: next }
69 - }, {} as Record<'string', ProductAndDevice>) 68 + }, {} as Record<'string', DeviceList>)
  69 + },
  70 +
  71 + getCurrentNodeDataById(config: CreateComponentType): Nullable<NodeDataType> {
  72 + const { cellInfo } = config
  73 + const { id } = cellInfo || {}
  74 + if (!id) return null
  75 + return this.contentData.find(item => item.id === id) || null
70 }, 76 },
71 }, 77 },
72 78