代码提交

src/components/mainHeader/index.vue

@@ -9,11 +9,7 @@ import lighting from '@/views/lighting/index.vue' //照明
 import carbonEmission from '@/views/carbonEmission/index.vue' //碳排放
 
 import screen from '@/views/screen/index.vue' //显示屏
-<<<<<<< HEAD
-
-=======
 import energyMonitoring from '@/views/energyMonitoring/index.vue'
->>>>>>> af48436e2178f27ff7772684e807f1fea9516ede
 const nowDate = ref('')
 const nowWeek = ref('')
 const nowMin = ref('')
@@ -30,11 +26,7 @@ timer.value = setInterval(()=>{
 },1000)
 const menuList = ref([
   {name:shallowRef(overview),default:'../../assets/images/menu/overview.png',select:'../../assets/images/menu/overview-select.png'},
-<<<<<<< HEAD
-  { //name:shallowRef(energyMonitoring),
-=======
   {name:shallowRef(energyMonitoring),
->>>>>>> af48436e2178f27ff7772684e807f1fea9516ede
     default:'../../assets/images/menu/energy.png',select:'../../assets/images/menu/energy-select.png'},
   {name:shallowRef(energyEfficiency),default:'../../assets/images/menu/energy-efficiency.png',select:'../../assets/images/menu/energy-efficiency-select.png'},
   {name:shallowRef(drainage),default:'../../assets/images/menu/drainage.png',select:'../../assets/images/menu/drainage-select.png'},

src/views/energyMonitoring/index.vue

@@ -134,16 +134,17 @@ function getDailyElectricityConsumption() {
     },
     buildPath: function (ctx, shape) {
       const xAxisPoint = shape.xAxisPoint;
-      const c0 = [shape.x, shape.y]; // 左侧面 右上点
+      const c0 = [shape.x - 10, shape.y];
-      const c1 = [shape.x - offsetX, shape.y - offsetY + 5]; // 左侧面  左上点
+      const c1 = [shape.x + 10, shape.y];
-      const c2 = [xAxisPoint[0] - offsetX, xAxisPoint[1] - offsetY + 5]; // 左侧面 左下点
+      const c2 = [xAxisPoint[0] + 10, xAxisPoint[1]];
-      const c3 = [xAxisPoint[0], xAxisPoint[1] + 5]; // 左侧面 右下点
+      const c3 = [xAxisPoint[0] - 10, xAxisPoint[1]];
       ctx
         .moveTo(c0[0], c0[1])
         .lineTo(c1[0], c1[1])
         .lineTo(c2[0], c2[1])
         .lineTo(c3[0], c3[1])
         .closePath();
+      ctx.stroke();
     },
   });
   // 绘制右侧面
@@ -154,16 +155,17 @@ function getDailyElectricityConsumption() {
     },
     buildPath: function (ctx, shape) {
       const xAxisPoint = shape.xAxisPoint;
-      const c1 = [shape.x, shape.y]; //右侧面左上点
+      const c1 = [shape.x + 9, shape.y];
-      const c2 = [xAxisPoint[0], xAxisPoint[1] + 5]; //右侧面 左下点
+      const c2 = [xAxisPoint[0] + 9, xAxisPoint[1]];
-      const c3 = [xAxisPoint[0] + offsetX, xAxisPoint[1] - offsetY + 5]; //右侧面  右下点
+      const c3 = [xAxisPoint[0] + 9 + 8, xAxisPoint[1] - 10];
-      const c4 = [shape.x + offsetX, shape.y - offsetY + 5]; //右侧面 右上点
+      const c4 = [shape.x + 7 + 8, shape.y - 5];
       ctx
         .moveTo(c1[0], c1[1])
         .lineTo(c2[0], c2[1])
         .lineTo(c3[0], c3[1])
         .lineTo(c4[0], c4[1])
         .closePath();
+      ctx.stroke();
     },
   });
   // 绘制顶面
@@ -173,16 +175,17 @@ function getDailyElectricityConsumption() {
       y: 0,
     },
     buildPath: function (ctx, shape) {
-      const c1 = [shape.x, shape.y + 5]; //顶部菱形下点
+      const c1 = [shape.x - 10, shape.y];
-      const c2 = [shape.x + offsetX, shape.y - offsetY + 5]; //顶部菱形右点
+      const c2 = [shape.x + 10, shape.y];
-      const c3 = [shape.x, shape.y - offsetX + 5]; //顶部菱形上点
+      const c3 = [shape.x + 15, shape.y - 5];
-      const c4 = [shape.x - offsetX, shape.y - offsetY + 5]; //顶部菱形左点
+      const c4 = [shape.x - 5, shape.y - 5];
       ctx
         .moveTo(c1[0], c1[1])
         .lineTo(c2[0], c2[1])
         .lineTo(c3[0], c3[1])
         .lineTo(c4[0], c4[1])
         .closePath();
+      ctx.stroke();
     },
   });
   // 注册三个面图形
@@ -206,9 +209,9 @@ function getDailyElectricityConsumption() {
   // let colorArr = [["#12D5AF"], ["#0BC19D", "rgba(13,8,16,0)"], ["#68EFD4", "rgba(14,185,151,0)"]]
   // 蓝色渐变
   let colorArr = [
-    ["#71ddff"],
+    ["rgba(0, 170, 193, 1)"],
-    ["rgba(12, 149, 198, 1)", "rgba(13,8,16,0)"],
+    ["rgba(0, 224, 255, 1)", "rgba(13,8,16,0)"],
-    ["rgba(34, 188, 255, 1)", "rgba(14,156,185,0)"],
+    ["rgba(0, 224, 255, 1)", "rgba(14,156,185,0)"],
   ];
   let myChart = echarts.init(
     document.getElementById("dailyElectricityConsumption")
@@ -271,7 +274,8 @@ function getDailyElectricityConsumption() {
       splitLine: {
         show: true,
         lineStyle: {
-          color: "rgba(255,255,255,0.16)",
+          type: "dashed",
+          color: "rgba(1, 39, 37, 0.30)",
         },
       },
       // y轴刻度线
@@ -373,7 +377,7 @@ function getDailyElectricityConsumption() {
         type: "bar",
         label: {
           normal: {
-            show: true,
+            show: false,
             position: "top",
             formatter: (e) => {
               return e.value;
@@ -398,7 +402,7 @@ onMounted(() => {
   //实时负荷
   getRealTimeLoad();
   //当日累计用电量
-  getDailyElectricityConsumption()
+  getDailyElectricityConsumption();
 });
 </script>