Bläddra i källkod

Merge branch '9.1'

Karsa 2 år sedan
förälder
incheckning
733bb95b02
1 ändrade filer med 49 tillägg och 28 borttagningar
  1. 49 28
      src/views/chartShow/index.vue

+ 49 - 28
src/views/chartShow/index.vue

@@ -58,7 +58,7 @@ const basicYAxis = {
   lineWidth: 1,
   lineColor: '#bfbfbf',
   tickColor: '#bfbfbf',
-  offset: 0,
+  // offset: 0,
   visible: true,
   gridLineWidth: 0,
   tickPosition: 'inside',
@@ -166,7 +166,9 @@ export default defineComponent({
 
       //拼接标题 数据列
       let data = [] as any[],ydata = [] as any[],minTimeArr: number[] = [],maxTimeArr: number[] = [];
-      const chartData = _.cloneDeep(dataList);
+      // const chartData = _.cloneDeep(dataList);
+       //有右二轴时排个序 按照左 右 右2的顺序
+      let chartData = dataList.some(_ =>_.IsAxis===2) ? changeEdbOrder(dataList) : _.cloneDeep(dataList);
       
       chartData.forEach((item:IDataProps ,index:number) => {
 
@@ -179,11 +181,11 @@ export default defineComponent({
           ...basicYAxis,
           labels: {
             formatter: function (ctx: any) {
-              let val = ctx.value < 1000 ? ctx.value :  ctx.value / 1000 + 'k';
+              let val = Math.abs(ctx.value) < 1000 ? ctx.value :  ctx.value / 1000 + 'k';
               return sameSideIndex !== index ? '' : val;
             },
             align: 'center',
-            x: item.IsAxis === 0 ? 5 : -5,
+            x: [0,2].includes(item.IsAxis) ? 5 : -5,
             style: {
               fontSize: '10px',
             },
@@ -194,9 +196,9 @@ export default defineComponent({
             align: 'high',
             rotation: 0,
             y: -15,
-            offset: -(10 * item.Unit.length),
+            offset: 0
           },
-          opposite: item.IsAxis === 0,
+          opposite: [0,2].includes(item.IsAxis),
           reversed: item.IsOrder,
           min: Number(chartData[sameSideIndex].MinData),
           max: Number(chartData[sameSideIndex].MaxData),
@@ -216,7 +218,7 @@ export default defineComponent({
         let obj = {
           data: [] as any[],
           type:  'spline',
-          yAxis: index,
+          yAxis: sameSideIndex,
           name:
             dynamic_arr.length > 1
               ? `${item.EdbName}(${item.SourceName})${dynamic_tag}`
@@ -280,6 +282,18 @@ export default defineComponent({
       return  timestamp / 6;
     }
 
+    /* 指标顺序调整  IsAxis: 0右轴 1左轴 2右2*/
+    const changeEdbOrder = (data: any[]) => {
+      // 左轴指标
+      let left_edbs = data.filter(_ => _.IsAxis===1);
+      //右轴指标
+      let right_edbs = data.filter(_ => !_.IsAxis);
+      // 右2轴指标
+      let right_two_edbs = data.filter(_ => _.IsAxis === 2);
+      // 按 左 右 右2顺序排列
+      return [left_edbs,right_edbs,right_two_edbs].flat(Infinity);
+    }
+
     /* 堆叠图/组合图设置  
     本来和曲线图逻辑基本一致兼容下即可 为了以后便于维护和阅读还是拆开写吧
      */
@@ -288,7 +302,9 @@ export default defineComponent({
 
       //拼接标题 数据列
       let data = [] as any[],ydata = [] as any[],minTimeArr: number[] = [],maxTimeArr: number[] = [];
-      const chartData = _.cloneDeep(dataList);
+      // const chartData = _.cloneDeep(dataList);
+      //有右二轴时排个序 按照左 右 右2的顺序
+      let chartData = dataList.some(_ =>_.IsAxis===2) ? changeEdbOrder(dataList) : _.cloneDeep(dataList);
 
       //支持的图表类型
       const chartTypeMap: IChartType  = {
@@ -323,11 +339,11 @@ export default defineComponent({
           ...basicYAxis,
           labels: {
             formatter: function (ctx: any) {
-              let val = ctx.value < 1000 ? ctx.value :  ctx.value / 1000 + 'k';
+              let val =  Math.abs(ctx.value) < 1000 ? ctx.value :  ctx.value / 1000 + 'k';
               return sameSideIndex !== index ? '' : val;
             },
             align: 'center',
-            x: item.IsAxis === 0 ? 5 : -5,
+            x: [0,2].includes(item.IsAxis) ? 5 : -5,
             style: {
               fontSize: '10px',
             },
@@ -338,9 +354,9 @@ export default defineComponent({
             align: 'high',
             rotation: 0,
             y: -15,
-            offset: -(10 * item.Unit.length),
+            offset: 0
           },
-          opposite: item.IsAxis === 0,
+          opposite: [0,2].includes(item.IsAxis),
           reversed: item.IsOrder,
           min: Number(chartData[sameSideIndex].MinData),
           max: Number(chartData[sameSideIndex].MaxData),
@@ -736,22 +752,27 @@ export default defineComponent({
 
     /* 拼接动态的指标名称小标签 */
     const concatDynamicTag = ({ IsAxis,IsOrder,EdbInfoType,LeadValue,LeadUnit }: IDataProps ): string => {
-      // IsAxis左轴1 右轴0 IsOrder正序false 逆序true EdbInfoType是否是领先指标
-      return IsAxis && IsOrder && EdbInfoType
-            ? '(逆序)'
-            : !IsAxis && IsOrder && EdbInfoType
-            ? '(右轴,逆序)'
-            : !IsAxis && !IsOrder && EdbInfoType
-            ? '(右轴)'
-            : !IsAxis && !IsOrder && !EdbInfoType
-            ? `(右轴,领先${LeadValue}${LeadUnit})`
-            : !IsAxis && IsOrder && !EdbInfoType
-            ? `(右轴,逆序,领先${LeadValue}${LeadUnit})`
-            : IsAxis && IsOrder && !EdbInfoType
-            ? `(逆序,领先${LeadValue}${LeadUnit})`
-            : IsAxis && !IsOrder && !EdbInfoType
-            ? `(领先${LeadValue}${LeadUnit})`
-            : '';
+      // IsAxis左轴1 右轴0 2右2轴 
+      //IsOrder正序false 逆序true 
+      //EdbInfoType是否是领先指标
+      const axisLabelMap:any = {
+        0: '右轴',
+        2: '右2轴'
+      }
+      const orderLabelMap:any = {
+        1: '逆序'
+      }
+      const edbInfoMap:any = {
+        0: '领先'
+      }
+      
+      let axis_tag = axisLabelMap[IsAxis] || '';
+      //逆序拼接
+      let order_tag = orderLabelMap[Number(IsOrder)] ? `${axis_tag ? ',': ''}${orderLabelMap[Number(IsOrder)]}` : ''
+      //领先拼接
+      let edb_tag = edbInfoMap[EdbInfoType] ? `${(axis_tag||order_tag) ? ',' : '' }${edbInfoMap[EdbInfoType]}${LeadValue}${LeadUnit}` : '';
+
+      return (axis_tag || order_tag || edb_tag) ? `(${axis_tag}${order_tag}${edb_tag})` : ''
     }
 
     /* 复制标题 */