修改看板

src/views/boardGenerate/nodes/board/lineNode.vue

@@ -103,7 +103,9 @@ const defaultOption = {
   xAxis: [
     {
       name: props.data?.options?.xName || '',
+      nameLocation: props.data?.options?.xNameLocation || 'end',
       type: 'category',
+      boundaryGap: props.data?.options?.boundaryGap || false,
       axisLine: {
         show: props.data?.options?.xAxisLineShow || false,
         lineStyle: {
@@ -119,35 +121,55 @@ const defaultOption = {
       axisLabel: {
         show: props.data?.options?.xAxisLabelShow || false,
         interval: props.data?.options?.xAxisLabelInterval ? 0 : 'auto',
+        inside: props.data?.options?.xAxisLabelInside || false,
         formatter: props.data?.options?.xAxisLabelFormatter || null,
+        rotate: props.data?.options?.xAxisLabelRotate || 0,
         color: props.data?.options?.xAxisLabelColor || '#fff',
         fontSize: props.data?.options?.xAxisLabelFontSize || 12,
         margin: props.data?.options?.xAxisLabelMargin || 3
       },
-      boundaryGap: props.data?.options?.boundaryGap || false
+      splitLine: {
+        show: props.data?.options?.xAxisSplitLineShow || false,
+        lineStyle: {
+          color: props.data?.options?.xAxisSplitLineColor || '#DCE2E8',
+          type: props.data?.options?.xAxisSplitLineType || 'solid'
+        }
+      }
     }
   ],
   yAxis: [
     {
       name: props.data?.options?.yName || '',
       type: 'value',
-      axisTick: {
-        show: false
-      },
       axisLine: {
-        show: true,
+        show: props.data?.options?.yAxisLineShow || false,
         lineStyle: {
-          color: '#fff'
+          color: props.data?.options?.yAxisLineColor || '#DCE2E8'
+        }
+      },
+      axisTick: {
+        show: props.data?.options?.yAxisTickShow || false,
+        lineStyle: {
+          color: props.data?.options?.yAxisTickColor || '#DCE2E8'
         }
       },
       axisLabel: {
-        textStyle: {
-          color: '#fff'
-        }
+        show: props.data?.options?.yAxisLabelShow || false,
+        interval: props.data?.options?.yAxisLabelInterval ? 0 : 'auto',
+        inside: props.data?.options?.yAxisLabelInside || false,
+        formatter: props.data?.options?.yAxisLabelFormatter || null,
+        rotate: props.data?.options?.yAxisLabelRotate || 0,
+        color: props.data?.options?.yAxisLabelColor || '#fff',
+        fontSize: props.data?.options?.yAxisLabelFontSize || 12,
+        margin: props.data?.options?.yAxisLabelMargin || 3
       },
       splitLine: {
-        show: false
+        show: props.data?.options?.yAxisSplitLineShow || false,
+        lineStyle: {
+          color: props.data?.options?.yAxisSplitLineColor || '#DCE2E8',
+          type: props.data?.options?.yAxisSplitLineType || 'solid'
         }
+      },
     }
   ],
   series: [

src/views/boardGenerate/tool.js

@@ -18,27 +18,67 @@ const getOption = (e) => {
       gridBottom: 10,
       gridRight: 10,
       xName: '',
+      xNameLocation: 'end',
       xAxisLineShow: true,
+      boundaryGap: true,
       xAxisLineColor: '#DCE2E8',
       xAxisTickShow: true,
       xAxisTickColor: '#DCE2E8',
       xAxisLabelShow: true,
       xAxisLabelInterval: false,
+      xAxisLabelInside: false,
+      xAxisLabelRotate: 0,
       xAxisLabelFormatter: '',
       xAxisLabelColor: '#fff',
       xAxisLabelFontSize: 12,
       xAxisLabelMargin: 3,
-      boundaryGap: true,
+      xAxisSplitLineShow: false,
+      xAxisSplitLineColor: '#DCE2E8',
+      xAxisSplitLineType: 'solid',
       yName: '',
       tooltip: true,
       legend: true
     };
   } else if (e === 'bar' || e === 'multiBars') {
-    return { title: '', yNames: [], gridTop: 30, gridLeft: 5, gridBottom: 10, gridRight: 10, xName: '', yName: '', tooltip:true, legend:true };
+    return {
+      title: '',
+      yNames: [],
+      gridTop: 30,
+      gridLeft: 5,
+      gridBottom: 10,
+      gridRight: 10,
+      xName: '',
+      yName: '',
+      tooltip: true,
+      legend: true
+    };
   } else if (e === 'backgroundBar') {
-    return { title: '', yNames: [], gridTop: 30, gridLeft: 5, gridBottom: 10, gridRight: 10, xName: '', yName: '', tooltip:true, legend:true,backgroundColor:'rgba(180, 180, 180, 0.2)' };
+    return {
+      title: '',
+      yNames: [],
+      gridTop: 30,
+      gridLeft: 5,
+      gridBottom: 10,
+      gridRight: 10,
+      xName: '',
+      yName: '',
+      tooltip: true,
+      legend: true,
+      backgroundColor: 'rgba(180, 180, 180, 0.2)'
+    };
   } else if (e === 'curve' || e === 'multiCurves') {
-    return { title: '', yNames: [], gridTop: 30, gridLeft: 5, gridBottom: 10, gridRight: 10, xName: '', yName: '', tooltip:true, legend:true };
+    return {
+      title: '',
+      yNames: [],
+      gridTop: 30,
+      gridLeft: 5,
+      gridBottom: 10,
+      gridRight: 10,
+      xName: '',
+      yName: '',
+      tooltip: true,
+      legend: true
+    };
   } else if (e === 'lineBar') {
     return {
       title: '',
@@ -94,7 +134,7 @@ const getOption = (e) => {
       tdColor: ['#fff'],
       thBgColor: '#fff',
       tdBgColor: ['#000']
-    }
+    };
   } else if (e === 'carousel') {
     return { swiperOptions: {}, imageFit: 'contain', carouselImages: [] };
   } else if (e === 'background') {