bug_5007 十条之后的所有配置从第一条线条配置开始重新引用

src/views/hzyb/chart/Detail.vue

@@ -521,18 +521,19 @@ const initRelevanceChart=(data)=>{
     //处理series
     let seriesData=[]
     data.YDataList.forEach((item,index)=>{
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let serie_item = {
           data: item.Value,
-          type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'spline',
-          dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+          type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'spline',
+          dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
           yAxis: 0,
           name: data.ChartInfo.ChartName,
           nameCh: data.ChartInfo.ChartName,
           nameEn: data.ChartInfo.ChartName,
           color: '#00f',
           chartType: 'linear',
-          lineWidth: (noExceed&&chartTheme.lineOptionList[index].lineWidth) || 3,
+          lineWidth: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth) || 3,
           visible:true,
           marker: {
             enabled: false
@@ -753,16 +754,17 @@ const setCommodityChart = () => {
     data.forEach((item,index) => {
         //处理首或/尾全是无效数据的以null填充
         let filterData = filterInvalidData(item)
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let serie_item = {
             data: filterData,
-            type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'spline',
-            dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+            type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'spline',
+            dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
             yAxis: 0,
             name: item.Name,
             color: item.Color,
             chartType: 'linear',
-            lineWidth: (noExceed&&chartTheme.lineOptionList[index].lineWidth) || 3,
+            lineWidth: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth) || 3,
             visible: true,
             marker: {
                 enabled: false
@@ -904,7 +906,8 @@ const setSectionScatterChart = () => {
     //数据列
     let series = [];
     DataList.forEach((item,index) => {
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         //数据列
         let series_item = {
             data: [],
@@ -915,7 +918,7 @@ const setSectionScatterChart = () => {
             chartType: 'linear',
             zIndex:1,
             marker: {
-                radius: (noExceed&&chartTheme.lineOptionList[index].radius)||5,
+                radius: (chartTheme&&chartTheme.lineOptionList[lineIndex].radius)||5,
             },
             visible: true
         }
@@ -1055,15 +1058,16 @@ const setStatisticFrequency = () => {
         max: index===0? Number(LeftMaxValue):Number(RightMaxValue),
         tickWidth: 1,
     }
-    const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+    // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+    const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
     let series_item = {
         data: item.Value.map(_ =>[_.X,_.Y]),
-        dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
-        type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'spline',
+        dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
+        type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'spline',
         yAxis: index,
         name: item.Name,
         color: item.Color,
-        lineWidth: (noExceed&&chartTheme.lineOptionList[index].lineWidth)||3,
+        lineWidth: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth)||3,
         chartType: 'linear',
         visible: true,
         zIndex:1
@@ -1305,16 +1309,17 @@ const setRadarChart = () => {
     //系列
     let series = [];
     YDataList.forEach((item,index) => {
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let serie_item = {
             data: item.Value,
             pointPlacement: 'on',
-            type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'line',
-            dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+            type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'line',
+            dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
             yAxis: 0,
             name: item.Name || item.Date,
             color: item.Color,
-            lineWidth: (noExceed&&chartTheme.lineOptionList[index].lineWidth) || 1,
+            lineWidth: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth) || 1,
             chartType: 'linear',
             visible: true
         };
@@ -1416,26 +1421,27 @@ const setSplineOpt=(data)=>{
 
         //预测指标配置
         let predict_params = item.EdbInfoCategoryType === 1 ? getPredictParams(item) : {};
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let seriesItemObj={
             data:[],
             dataGrouping:{
                 enabled:false
             },
-            type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'spline',
-            dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+            type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'spline',
+            dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
             yAxis:index,
             name:temName,
             color: item.ChartColor,
-            lineWidth: Number(item.ChartWidth)|| (noExceed&&chartTheme.lineOptionList[index].lineWidth)||1,
+            lineWidth: Number(item.ChartWidth)|| (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth)||1,
             visible:true,
             LatestDate:item.LatestDate,
             LatestValue:item.LatestValue,
-            marker: noExceed && chartTheme.lineOptionList[index].dataMark && chartTheme.lineOptionList[index].dataMark!='none'?{
+            marker: chartTheme && chartTheme.lineOptionList[lineIndex].dataMark && chartTheme.lineOptionList[lineIndex].dataMark!='none'?{
                 enabled:true,
-                symbol: chartTheme.lineOptionList[index].markType || 'circle',
-                fillColor:chartTheme.lineOptionList[index].markColor,
-                radius: chartTheme.lineOptionList[index].markSize
+                symbol: chartTheme.lineOptionList[lineIndex].markType || 'circle',
+                fillColor:chartTheme.lineOptionList[lineIndex].markColor,
+                radius: chartTheme.lineOptionList[lineIndex].markSize
             }:{},
             ...predict_params
         }
@@ -1852,23 +1858,25 @@ const setSeasonOpt=(data)=>{
     chartDataHandle.forEach((item,index)=>{
             //预测指标配置
         let predict_params =  data.EdbInfoCategoryType === 1 ? getSeasonPredictParams(item.CuttingDataTimestamp) : {};
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let seriesItem={
             data:[],
             dataGrouping:{
                 enabled:false
             },
-            type: (noExceed&&chartTheme.lineOptionList[index].lineType) || data.ChartStyle,
-            dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+            type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || data.ChartStyle,
+            dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
             yAxis:0,
             name:item.ChartLegend,
-            color:colorsArr.slice(-chartDataHandle.length)[index%(colorsArr.length)],                
+            lineWidth: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth) || 1,
+            // color:colorsArr.slice(-chartDataHandle.length)[lineIndex], //与PC端的配置不同步，导致两边 十条之后的线条颜色不对应            
             visible:true,
-            marker: noExceed && chartTheme.lineOptionList[index].dataMark && chartTheme.lineOptionList[index].dataMark!='none'?{
+            marker: chartTheme && chartTheme.lineOptionList[lineIndex].dataMark && chartTheme.lineOptionList[lineIndex].dataMark!='none'?{
                 enabled:true,
-                symbol: chartTheme.lineOptionList[index].markType || 'circle',
-                fillColor:chartTheme.lineOptionList[index].markColor,
-                radius: chartTheme.lineOptionList[index].markSize
+                symbol: chartTheme.lineOptionList[lineIndex].markType || 'circle',
+                fillColor:chartTheme.lineOptionList[lineIndex].markColor,
+                radius: chartTheme.lineOptionList[lineIndex].markSize
             }:{},
             ...predict_params
         }
@@ -1927,6 +1935,7 @@ const setSeasonOpt=(data)=>{
     }]
 
     chartData.value.series=series
+    chartData.value.colors=colorsArr.slice(-chartDataHandle.length)
     chartData.value.yAxis=yAxis
     // chartData.value.rangeSelector=rangeSelector
     // 设置坐标轴极值

src/views/hzyb/hooks/chartBase.js

@@ -222,14 +222,15 @@ export const setSplineOpt=(data,resData)=>{
 
         //预测指标配置
         let predict_params = item.EdbInfoCategoryType === 1 ? getPredictParams(item) : {};
-        const noExceed = chartTheme && chartTheme.lineOptionList.length > index //线条数没超过图表可配置的线条数
+        // 图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
         let seriesItemObj={
             data:[],
             dataGrouping:{
                 enabled:false
             },
-            type: (noExceed&&chartTheme.lineOptionList[index].lineType) || 'spline',
-            dashStyle: (noExceed&&chartTheme.lineOptionList[index].dashStyle)||'Solid',
+            type: (chartTheme&&chartTheme.lineOptionList[lineIndex].lineType) || 'spline',
+            dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
             yAxis:index,
             name:temName,
             color: item.ChartColor,