Merge branch 'ETA1.9.6'

src/views/hzyb/chart/Detail.vue

@@ -369,7 +369,7 @@ const getChartInfo=async (type)=>{
         // document.title=res.data.ChartInfo.ChartName
         
         // 设置highchart配置 ChartType: 1曲线图 2季节图:季节图中公历和农历数据结构不同
-        if(![2,7,10,11].includes(res.data.ChartInfo.ChartType)){
+        if(![2,7,10,11,14].includes(res.data.ChartInfo.ChartType)){
             if(type=='init'){
                 dateType.value=res.data.ChartInfo.DateType
                 startYear.value=res.data.ChartInfo.StartYear
@@ -409,6 +409,9 @@ const getChartInfo=async (type)=>{
         //雷达图
         res.data.ChartInfo.ChartType === 11 && initRadarData(res.data);
 
+        // 截面组合图
+        res.data.ChartInfo.ChartType === 14 && initSectionalCombinationChart(res.data);
+
         
 
         // 向小程序发送分享数据
@@ -477,6 +480,197 @@ const getCommonChartDetail=async ()=>{
 }
 getChartInfo('init')
 
+// 截面组合图初始化
+function initSectionalCombinationChart(data){
+    const {XDataList,UnitList,SeriesList,IsHeap}=data.DataResp
+    /* 主题样式*/
+    const chartTheme =  resData.value.ChartInfo.ChartThemeStyle ? JSON.parse(resData.value.ChartInfo.ChartThemeStyle) : null;
+      
+    let leftIndex = SeriesList.findIndex((item) => item.IsAxis===1);
+    let rightIndex = SeriesList.findIndex((item) => !item.IsAxis);
+    let rightTwoIndex = SeriesList.findIndex((item) => item.IsAxis ===2);
+    axisLimitData.leftMin=data.ChartInfo.LeftMin
+    axisLimitData.leftMax=data.ChartInfo.LeftMax
+    axisLimitData.rightTwoMin=data.ChartInfo.Right2Min
+    axisLimitData.rightTwoMax=data.ChartInfo.Right2Max
+    axisLimitData.rightMin=data.ChartInfo.RightMin
+    axisLimitData.rightMax=data.ChartInfo.RightMax
+    if(leftIndex!=-1) {
+        hasLeftAxis.value=true
+    }
+    if(rightIndex!=-1){
+        hasRightAxis.value=true
+    }
+    if(rightTwoIndex!=-1){
+        hasRightTwoAxis.value=true
+    }
+
+    //x轴
+    const xAxis={
+        categories:XDataList.map(_=>_.Name),
+        tickWidth: 1,
+        labels: {
+          style:{
+            ...chartTheme&&chartTheme.xAxisOptions.style
+          },
+        },
+        plotBands: setAxisPlotAreas(3),
+        plotLines: setAxisPlotLines(3)
+    }
+
+    let yAxis=[]
+    let seriesData=[]
+
+    //有右二轴时排个序 按照左 右 右2的顺序
+    const chartDataList = SeriesList.some(_ =>_.IsAxis===2) ? changeEdbOrder(SeriesList) : _.cloneDeep(SeriesList);
+    chartDataList.forEach((item,index)=>{
+        //轴位置值相同的下标
+        const sameSideIndex = chartDataList.findIndex(
+          (i) => i.IsAxis === item.IsAxis
+        );
+
+        const yTitleMap={
+          1:['LeftName','LeftNameEn'],
+          0:['RightName','RightNameEn'],
+          2:['RightTwoName','RightTwoNameEn'],
+        }
+
+        let minLimit = 0,maxLimit = 0
+        const limitMap = {
+            0:['rightMin','rightMax'],
+            1:['leftMin','leftMax'],
+            2:['rightTwoMin','rightTwoMax']
+        }
+        if(limitMap[item.IsAxis]){
+            minLimit = axisLimitData[`${limitMap[item.IsAxis][0]}`]||0
+            maxLimit = axisLimitData[`${limitMap[item.IsAxis][1]}`]||0
+        }
+
+        let yItem = {
+          ...basicYAxis,
+          title: {
+            text: UnitList[yTitleMap[item.IsAxis][0]],
+            style:{
+              ...chartTheme&&chartTheme.yAxisOptions.style
+            },
+            align: 'high',
+            rotation: 0,
+            y: -12,
+            // x: (item.IsAxis===0 && this.rightTwoIndex>-1) ? -chartData[this.rightTwoIndex].Unit.length*12 : 0,
+            textAlign: item.IsAxis===1 ? 'left' : 'right',
+            reserveSpace: false
+          },
+          labels: {
+            formatter: function (ctx) {
+              return ctx.value;
+            },
+            align: 'center',
+            x: [0,2].includes(item.IsAxis) ? 5 : -5,
+            style: {
+              ...chartTheme&&chartTheme.yAxisOptions.style,
+            }
+          },
+          opposite: [0,2].includes(item.IsAxis),
+          min: Number(minLimit),
+          max: Number(maxLimit),
+          tickWidth: 1,
+          visible: sameSideIndex === index,
+          plotBands: setAxisPlotAreas(item.IsAxis),
+          plotLines: setAxisPlotLines(item.IsAxis)
+        };
+
+        //堆叠图的yAxis必须一致 数据列所对应的y轴
+        let serie_yIndex = index;
+        if(IsHeap==1) {
+          // 类型为堆叠图时公用第一个指标y轴 
+          serie_yIndex =  0;
+        }
+
+        //数据列
+        let dataArr=item.DataList||[]
+        // 根据NoDataEdbIndex 将对应位置的值置为null
+        dataArr.forEach((i,index)=>{
+          if(item.NoDataEdbIndex.includes(index)){
+            dataArr[index]=null
+          }
+        })
+        //图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+		const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
+        let obj={
+          data:dataArr,
+          type: item.ChartStyle||'',
+          dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
+          chartType:'linear',
+          yAxis: serie_yIndex,
+          name:item.SeriesName,
+          nameCh:item.SeriesName,
+          nameEn:item.SeriesNameEn,
+          color: item.ChartColor,
+          lineWidth: Number(item.ChartWidth)||(chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth),
+          borderWidth: 1,
+          borderColor: item.ChartColor,
+          marker: {//展示数据点
+            enabled:item.ChartStyle!='column'&&item.IsPoint?true:false,
+            radius: (chartTheme&&chartTheme.lineOptionList[lineIndex].radius)||5,
+          },
+          dataLabels: {//展示数值
+            enabled: item.IsNumber?true:false,
+            align:item.ChartStyle=='column'?'center':undefined,
+            y:item.ChartStyle=='column'?-20:0,
+            inside: item.ChartStyle=='column'?false:undefined,
+            crop: item.ChartStyle=='column'?false:true,
+          },
+          stacking:IsHeap==1?'normal':undefined,
+          zIndex: ['line','spline'].includes(item.ChartStyle) ? 1 : 0, //防止组合图曲线被遮住
+        }
+
+        yAxis.push(yItem)
+        seriesData.push(obj)
+    })
+    
+    console.log(seriesData);
+
+    const tooltip={
+        formatter:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.name}:${item.y} ${sObj.unitNameCh}`
+          })
+          return str
+        },
+        formatterCh:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.nameCh}:${item.y} ${sObj.unitNameCh}`
+          })
+          return str
+        },
+        formatterEn:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.nameEn}:${item.y} ${sObj.unitNameEn}`
+          })
+          return str
+        },
+        shared:true
+    }
+    
+
+    chartData.value = {
+        title: {
+            text:''
+        },
+        tooltip,
+        series: seriesData,
+        yAxis: yAxis,
+        xAxis,
+    };
+
+      
+}
 
 //相关性图表设置
 const relevanceChartData=ref(null)
@@ -1695,7 +1889,8 @@ const setStackOrCombinChart = data => {
             LatestValue:item.LatestValue,
             borderWidth: 1,
             borderColor: item.ChartColor,
-            ...predict_params
+            ...predict_params,
+            stacking:resData.value.ChartInfo.ChartType==6&&!resData.value.DataResp.IsHeap?undefined:'normal',
         }
         item.DataList = item.DataList || [];
         for (let i of item.DataList) {