feat(tools): 新增台账管理功能模块

- 添加 addLedger API 接口定义和实现
- 创建工程配置表单组件 (EngineeringForm)
- 创建设备配置表单组件 (EquipmentForm)
- 创建项目和测点表单组件 (ProjectForm, LineForm)
- 实现台账树形结构面板 (LedgerTreePanel)
- 添加台账数据验证契约检查脚本
- 集成字典选项和动态表单验证功能
- 实现台账节点增删改查完整流程
- 优化 Echarts 图表组件分组渲染性能

frontend/src/components/echarts/line/index.vue

@@ -49,6 +49,7 @@ const emit = defineEmits<{
 }>()
 let chart: echarts.ECharts | any = null
 let isPanPointerDown = false
+let currentGroup: string | undefined
 
 const getChartViewportRoot = () => chart?.getZr()?.painter?.getViewportRoot?.() as HTMLElement | undefined
 
@@ -199,18 +200,18 @@ const resizeHandler = () => {
         chart.getZr().painter.getViewportRoot().style.display = ''
     })
 }
-const initChart = () => {
-    if (!props.isInterVal && !props.pieInterVal) {
-        unbindPanCursorEvents()
-        chart?.dispose()
-    }
-    // chart?.dispose()
-    chart = echarts.init(chartRef.value as HTMLDivElement)
+const updateChartGroup = () => {
+    if (!chart || props.group === currentGroup) return
+
+    currentGroup = props.group
+    chart.group = props.group || undefined
+
     if (props.group) {
-        chart.group = props.group
         echarts.connect(props.group)
     }
+}
 
+const buildChartOptions = () => {
     const options = {
         title: {
             left: 'center',
@@ -295,7 +296,10 @@ const initChart = () => {
     // console.log(options.series,"获取x轴");
     handlerBar(options)
 
-    chart.setOption(options, true)
+    return options
+}
+
+const bindChartEvents = () => {
     chart.off('datazoom')
     chart.on('datazoom', (params: any) => {
         const zoomPayload = Array.isArray(params.batch) ? params.batch[0] : params
@@ -309,16 +313,51 @@ const initChart = () => {
             end
         })
     })
+    bindPanCursorEvents()
+}
+
+const renderChart = (isInitial = false) => {
+    if (!chartRef.value) return
+
+    if (!chart) {
+        chart = echarts.init(chartRef.value)
+        updateChartGroup()
+        bindChartEvents()
+    } else {
+        updateChartGroup()
+    }
+
+    const options = buildChartOptions()
+
+    chart.setOption(options, {
+        notMerge: isInitial,
+        lazyUpdate: !isInitial
+    })
     chart.dispatchAction({
         type: 'takeGlobalCursor',
         key: 'dataZoomSelect',
         dataZoomSelectActive: props.options?.activeTool === 'box-zoom'
     })
-    bindPanCursorEvents()
+    if (props.options?.activeTool !== 'pan' && props.options?.activeTool !== 'mark') {
+        resetChartCursor()
+    }
 
-    setTimeout(() => {
-        chart.resize()
-    }, 0)
+    if (isInitial) {
+        setTimeout(() => {
+            chart.resize()
+        }, 0)
+    }
+}
+
+const initChart = () => {
+    if (!props.isInterVal && !props.pieInterVal) {
+        unbindPanCursorEvents()
+        chart?.dispose()
+        chart = null
+        currentGroup = undefined
+    }
+
+    renderChart(true)
 }
 const handlerBar = (options: any) => {
     if (Array.isArray(options.series)) {
@@ -450,9 +489,10 @@ onBeforeUnmount(() => {
     chart?.dispose()
 })
 watch(
-    () => props.options,
+    () => [props.options, props.group],
     () => {
-        initChart()
+        // 缩放按钮只更新坐标和缩放配置，复用实例可避免大数据趋势图反复销毁重建。
+        renderChart()
     }
 )
 </script>