风机绩效榜white-未完成

src/assets/styles/common/common.less

@@ -21,5 +21,7 @@
 @import "../theme/light/light-sp.less"; // 沙盘
 @import "../theme/light/light-qt.less"; // 其他
 
+@import "../theme/light/jjyx-fjjxb.less"; // 风机绩效榜
+
 // 暗色主题
 @import "../theme/dark/dark-jsc.less"; // 驾驶舱

src/assets/styles/theme/light/jjyx-fjjxb.less

@@ -0,0 +1,57 @@
+// 风机绩效榜
+@import "./setting.less";
+#appBody.light {
+    .com-table {
+		thead tr th{
+			color: @black;
+		}
+		
+		.el-scrollbar tr td {
+			color: @black;
+		}
+		
+		.el-scrollbar tr td.light span {
+			color: @blue;
+		}
+	}
+	.btn.green,.btn:hover{
+		color: @deepblue;
+		border-color: @deepblue;
+		background: rgba(54, 52, 142, 0.2);
+	}
+	
+	.el-select__popper.select{
+		background: @white;
+        border-color: @white;
+		.el-popper__arrow::before{
+			border: 1px solid @white !important;
+			background: @white !important;
+		}
+		.el-select-dropdown__item.selected,.el-select-dropdown__item:hover {
+		    color: @deepblue;
+			background:fade(@deepblue, 20);
+			border: 1px solid @deepblue;
+		}
+	}
+	
+	.el-select {
+	  .el-input {
+	    // .el-input__suffix {
+	    //   background: transparent;
+	    // }
+	    .el-input__inner {
+	      background: @white;
+	      background: @white;
+	    }
+	  }
+	
+	//   .el-select__tags .el-tag {
+	//     background-color: fade(@green, 50);
+	//     color: @white;
+	
+	//     .el-icon-close {
+	//       background-color: fade(@green, 50);
+	//     }
+	//   }
+	}
+}

src/assets/styles/theme/light/setting.less

@@ -3,4 +3,6 @@
 @black      : #000;
 @transition : 0.25s;
 @deepblue   : #36348e;
-@borderRaduis: 12px;
+@borderRaduis: 12px;
+@blue : #159AFA;
+@white : #ffffff;

src/components/chart/combination/bar-line-chart.vue

@@ -123,18 +123,26 @@ export default {
           icon: "ract",
           itemWidth: 8,
           itemHeight: 8,
-          inactiveColor: partten.getColor("gray"),
+          inactiveColor: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: partten.getColor("grayl"),
+            color: this.$store.state.themeName === "dark"
+              ? partten.getColor("grayl")
+              : "#000",
             fontSize: 12,
           },
         },
         tooltip: {
           trigger: "axis",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
+          backgroundColor: this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.5)",
+          borderColor: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
           textStyle: {
-            color: "#fff",
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: util.vh(16),
           },
         },
@@ -153,7 +161,9 @@ export default {
             backgroundColor: "transparent",
             // handleIcon: "path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z",
             handleStyle: {
-              color: partten.getColor("green"),
+              color: this.$store.state.themeName === "dark"
+              ? partten.getColor("green")
+              : partten.getColor("blue"),
             },
             moveHandleSize: 0,
             // dataBackground: {
@@ -174,9 +184,13 @@ export default {
             // },
             fillerColor: "transparent",
             textStyle: {
-              color: partten.getColor("grayl"),
+              color: this.$store.state.themeName === "dark"
+              ? partten.getColor("grayl")
+              : "#000",
             },
-            borderColor: partten.getColor("gray"),
+            borderColor: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
             brushSelect: false,
           },
         ],
@@ -184,7 +198,9 @@ export default {
           {
             type: "category",
             axisLabel: {
-              color: partten.getColor("gray"),
+              color: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
             },
             inverse: true,
             // minInterval: 10,
@@ -202,12 +218,16 @@ export default {
           {
             type: "value",
             axisLabel: {
-              color: partten.getColor("gray"),
+              color: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
             },
             axisLine: {
               type: "dashed",
               lineStyle: {
-                color: partten.getColor("gray"),
+                color: this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
               },
               width: 5,
             },
@@ -218,7 +238,7 @@ export default {
               lineStyle: {
                 type: "dashed",
                 dashOffset: 10,
-                color: partten.getColor("gray") + 80,
+                color: this.$store.state.themeName === "dark" ? "#5a6162" : "#000" + 80,
               },
             },
           },
@@ -269,10 +289,14 @@ export default {
           smooth: false, //平滑展示
           xAxisIndex: 1,
           lineStyle: {
-            color: partten.getColor("green"),
+            color: this.$store.state.themeName === "dark"
+              ? partten.getColor("green")
+              : partten.getColor("blue"),
           },
           itemStyle: {
-            color: partten.getColor("green"),
+            color: this.$store.state.themeName === "dark"
+              ? partten.getColor("green")
+              : partten.getColor("blue"),
           },
         });
       }
@@ -315,6 +339,9 @@ export default {
         }
       }
     },
+	"$store.state.themeName"() {
+	  this.initChart();
+	},
   },
 };
 </script>

src/helper/partten.js

@@ -12,11 +12,11 @@ const color = [
 	{ key: "cyan", value: "#1cbbb4" },
 	{ key: "brown", value: "#a5673f" },
 	{ key: "mauve", value: "#9c26b0" },
+	{ key: "deepblue", value: "#36348e" },
 ];
 
 function getColor(key) {
-    if (!key)
-        key = "green"
+	if(!color.some(ele=>{ return ele.key === key })) key = "green";
     return color.find((t) => { return t.key == key }).value;
 }