修改

.env.dev

@@ -1,7 +1,7 @@
 ###
  # @Author: zhp
  # @Date: 2024-04-28 13:42:51
- # @LastEditTime: 2024-04-28 13:43:03
+ # @LastEditTime: 2024-05-08 08:57:33
  # @LastEditors: zhp
  # @Description:
 ###

src/layout/components/AppMain.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-04-12 11:13:06
- * @LastEditTime: 2024-04-15 13:52:16
+ * @LastEditTime: 2024-05-08 13:37:05
  * @LastEditors: zhp
  * @Description:
 -->

src/store/modules/home.js

@@ -1,3 +1,4 @@
+
 import axios from "@/utils/request";
 import { deepClone } from "../../utils";
 
@@ -15,7 +16,25 @@ const state = {
     /* 能源驾驶舱 */
     energy: {},
     /* 效率驾驶舱 */
-    efficiency: {},
+    efficiency: {
+      chipOee: {
+        current: [],
+        previous: [],
+      },
+      transformRate: {
+        current: [],
+        previous: [],
+      },
+      chipRate: {
+        target: [],
+        current: [],
+        previous: [],
+      },
+      stdRate: {
+        target: [],
+        current: [],
+      },
+    },
   },
   home: {
     /** 主页状态 */
@@ -48,7 +67,11 @@ const mutations = {
         state.copilot.energy = payload.data;
         break;
       case "efficiency":
-        state.copilot.efficiency = payload.data;
+        console.log('222222', payload.chipOee)
+        state.copilot.efficiency.chipOee = payload.chipOee;
+        state.copilot.efficiency.transformRate = payload.transformRate;
+        state.copilot.efficiency.chipRate = payload.chipRate;
+        state.copilot.efficiency.stdRate = payload.stdRate;
         break;
     }
   },
@@ -64,20 +87,29 @@ const actions = {
   },
   /** 初始化驾驶舱数据 */
   async initCopilot({ commit }, { period, source }) {
+    if (source == "comprehensive") return;
+
     const fetcher = {
       yield: getCopilotYield,
-      energy: getCopilotEnergy,
+      comprehensive: getCopilotEnergy,
       efficiency: getCopilotEfficiency,
     }[source];
+    const handler = {
+      yield: splitCurrentAndPrevious,
+      comprehensive: () => null,
+      efficiency: splitCurrentAndPreviousA,
+    }[source];
     // 获取产量数据
+    // console.log('qqqqqq',handler)
     let { data: factoryList, type } = await fetcher(period);
     let targetList = null;
     if (source === "yield" || source === "efficiency") {
       // 获取目标数据
-      let { data } = await fetcher(period, true);
+      let { data } = await fetcher(period, true)
+      console.log('11111',data)
       targetList = data;
     }
-    const payload = splitCurrentAndPrevious(factoryList, targetList);
+    const payload = handler(factoryList, targetList);
     commit("SET_COPILOT_INFO", { type, payload });
   },
 };
@@ -89,7 +121,103 @@ export default {
   actions,
 };
 
+function splitCurrentAndPreviousA(factoryListResponse, targetListResponse) {
+  console.log('工厂',factoryListResponse);
+  // console.log('工厂',factoryListResponse);
+
+  // 初始数据
+  const { chipOee, transformRate, chipRate, stdRate } = initA();
+  factoryListResponse = [
+    {
+      factory: 0,
+      oee: 0.8,
+      previousYearOee: 0.7,
+      componentConversionEfficiency: 0.8,
+      previousYearComponentConversionEfficiency: 0.7,
+      glassType: 0,
+      yieldRate: 0.8,
+      previousYearYieldRate: 0.7,
+      chipYieldRate: 0.38,
+      componentYieldRate: 0.73,
+    },
+    {
+      factory: 1,
+      oee: 0.8,
+      previousYearOee: 0.7,
+      componentConversionEfficiency: 0.8,
+      previousYearComponentConversionEfficiency: 0.7,
+      glassType: 1,
+      yieldRate: 0.8,
+      previousYearYieldRate: 0.7,
+      chipYieldRate: 0.38,
+      componentYieldRate: 0.73,
+    },
+    {
+      factory: 2,
+      oee: 0.8,
+      previousYearOee: 0.7,
+      componentConversionEfficiency: 0.8,
+      previousYearComponentConversionEfficiency: 0.7,
+      glassType: 1,
+      yieldRate: 0.8,
+      previousYearYieldRate: 0.7,
+      chipYieldRate: 0.38,
+      componentYieldRate: 0.73,
+    },
+    {
+      factory: 3,
+      oee: 0.8,
+      previousYearOee: 0.7,
+      componentConversionEfficiency: 0.8,
+      previousYearComponentConversionEfficiency: 0.7,
+      glassType: 0,
+      yieldRate: 0.8,
+      previousYearYieldRate: 0.7,
+      chipYieldRate: 0.38,
+      componentYieldRate: 0.73,
+    },
+  ];
+  if (factoryListResponse) {
+    for (const factory of factoryListResponse) {
+      const fId = getFactoryId(factory);
+      // 获取目标值
+      if (targetListResponse) {
+        const {
+          chipYieldRate,
+          componentYieldRate,
+          chipOee,
+          componentConversionEfficiency,
+        } = getFactoryTargetValueA(targetListResponse, fId);
+        stdRate.target[fId] = chipYieldRate;
+        chipRate.target[fId] = componentYieldRate;
+      }
+      // 芯片OEE
+      chipOee.current[fId] = factory.oee * 100 || random_default();
+      chipOee.previous[fId] = factory.previousYearOee * 100 || random_default();
+      // 转化效率
+      transformRate.current[fId] =
+        factory.componentConversionEfficiency * 100 || random_default();
+      transformRate.previous[fId] =
+        factory.previousYearComponentConversionEfficiency * 100 || random_default();
+      // 芯片良率 与 标准组件良率
+      if (![0, 1].includes(factory.glassType)) continue;
+      const _t = [chipRate, stdRate][factory.glassType];
+      _t.current[fId] = factory.yieldRate || random_default();
+      _t.previous[fId] = factory.previousYearYieldRate || random_default();
+    }
+
+    return {
+      chipOee,
+      transformRate,
+      chipRate,
+      stdRate,
+    };
+  }
+}
+
 function splitCurrentAndPrevious(factoryListResponse, targetListResponse) {
+  console.log('工厂',factoryListResponse);
+
   // 初始数据
   const { chipInvest, ftoInvest, chipOutput, stdOutput, bipvOutput } = init();
   if (factoryListResponse) {
@@ -149,9 +277,58 @@ function getFactoryTargetValue(targetList, factoryId) {
   };
 }
 
+/**
+ * 获取 芯片良率目标值 和 标准组件良率目标值
+ * @param {*} targetList 目标值列表
+ * @param {*} factoryId 工厂ID
+ * @returns
+ */
+function getFactoryTargetValueA(targetList, factoryId) {
+  const target = targetList.find((item) => item.factory === factoryId);
+  if (target) {
+    return {
+      chipYieldRate: target.chipYieldRate ?? random_default(),
+      componentYieldRate: target.componentYieldRate ?? random_default(),
+    };
+  }
+  return {
+    chipYieldRate: random_default(),
+    componentYieldRate: random_default(),
+  };
+}
+
+/**
+ *
+ * @returns 初始化 效率模块里 初始状态值
+ */
+function initA() {
+  const t_ = {
+    current: Array(7).fill(0),
+    previous: Array(7).fill(0),
+  };
+  // 芯片OEE
+  const chipOee = deepClone(t_);
+  // 转化效率
+  const transformRate = deepClone(t_);
+  // 标准组件良率
+  const stdRate = {
+    ...deepClone(t_),
+    target: Array(7).fill(0),
+  };
+  // 芯片良率
+  const chipRate = deepClone(stdRate);
+
+  return {
+    chipOee,
+    transformRate,
+    chipRate,
+    stdRate,
+  };
+}
+
 /**
  *
- * @returns 初始化状态值
+ * @returns 初始化 产量模块里 初始状态值
  */
 function init() {
   const t_ = {
@@ -181,11 +358,11 @@ function init() {
   };
 }
 
-function random_default() {
-  return 0;
-  let a = Math.floor(Math.random() * 1000);
-  while (a < 600) {
-    a = Math.floor(Math.random() * 1000);
+function random_default(min = 0, max = 1) {
+  // return 0;
+  let a = Math.floor(Math.random() * max);
+  while (a < min) {
+    a = Math.floor(Math.random() * max);
   }
   return a;
 }

src/views/copilot/components/BarChartBase.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: BarChartBase.vue
     author: liubin
     date: 2024-04-10 08:59:28
-    description: 
+    description:
 -->
 
 <template>
@@ -18,7 +18,7 @@
     </div>
     <div
       ref="chart"
-      style="max-width: 50vw"
+      style="max-width: 40vw"
       :style="{ height: vHeight + 'vh' }"
     ></div>
   </chart-container>
@@ -199,6 +199,7 @@ export default {
         return;
       }
       const actualOptions = JSON.parse(JSON.stringify(this.options));
+      console.log('actualOptions', this.options)
       actualOptions.series[0].data = val[0].data;
       actualOptions.series[0].name = val[0].name;
       actualOptions.series[1].data = val?.[1]?.data || [];

src/views/copilot/components/Container.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: Container.vue
     author: liubin
     date: 2024-04-09 10:44:09
-    description: 
+    description:
 -->
 
 <template>

src/views/copilot/components/ContainerIcon.vue

@@ -1,8 +1,9 @@
-<!-- 
-    filename: ContainerIcon.vue
-    author: liubin
-    date: 2024-04-09 16:41:36
-    description: 
+<!--
+ * @Author: zhp
+ * @Date: 2024-04-28 13:42:51
+ * @LastEditTime: 2024-05-07 16:54:54
+ * @LastEditors: zhp
+ * @Description:
 -->
 
 <template>
@@ -14,8 +15,13 @@ import cube from "@/assets/images/homeindex/fto-icon.png";
 import chip from "@/assets/images/homeindex/chip-icon.png";
 import chip2 from "@/assets/images/homeindex/chip-icon-2.png";
 import bipv from "@/assets/images/homeindex/bipv-icon.png";
+import water from "@/assets/images/homeindex/water-icon.png";
+import gas from "@/assets/images/homeindex/gas-icon.png";
+import ware from "@/assets/images/homeindex/ware-icon.png";
+import flash from "@/assets/images/homeindex/flash-icon.png";
 import std from "@/assets/images/homeindex/std-icon.png";
 
+
 export default {
   name: "ContainerIcon",
   components: {},
@@ -40,6 +46,10 @@ export default {
         bipv:
           "background: url(" + bipv + ") no-repeat center center / 100% 100%",
         std: "background: url(" + std + ") no-repeat center center / 100% 100%",
+        water: "background: url(" + water + ") no-repeat center center / 100% 100%",
+        gas: "background: url(" + gas + ") no-repeat center center / 100% 100%",
+        flash: "background: url(" + flash + ") no-repeat center center / 100% 100%",
+        ware: "background: url(" + ware + ") no-repeat center center / 100% 100%",
       }[this.icon];
     },
   },

src/views/copilot/components/CopilotHeader.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: CopilotHeader.vue
     author: liubin
     date: 2024-04-16 15:14:01
-    description: 
+    description:
 -->
 
 <template>
@@ -63,7 +63,7 @@ export default {
     toggleFullScreen() {
       this.isFullscreen = !this.isFullscreen;
 
-      screenfull.toggle(document.querySelector(".copilot-layout"));
+      screenfull.toggle(document.querySelector(".copilot-layout"))
       // 矫正宽度
       // const el = document.querySelector(".copilot-layout");
       // el.style.width = this.isFullscreen ? "100vw" : "calc(100vw - 54px)";

src/views/copilot/container.vue

@@ -1,18 +1,14 @@
-<!-- 
+
+<!--
     filename: container.vue
     author: liubin
     date: 2024-04-16 14:51:25
-    description: 
+    description:
 -->
 
 <template>
-  <div class="copilot-layout">
-    <CopilotHeaderVue
-      :active="page"
-      :period="period"
-      @update:active="page = $event"
-      @update:period="period = $event"
-    />
+  <div class="copilot-layout" ref="copilot-layout">
+    <CopilotHeaderVue :active="page" :period="period" @update:active="page = $event" @update:period="period = $event" />
 
     <YieldCopilot v-if="page == '产量'" :period="period" />
     <EnergyCopilot v-if="page == '综合'" :period="period" />
@@ -52,8 +48,8 @@ export default {
   // },
 };
 </script>
-
 <style>
+
 .copilot-layout {
   padding: 16px;
   background: url(../../assets/images/copilot-bg.png) 0 0 / 100% 100% no-repeat;

src/views/copilot/efficiency/components/ChipOee.vue

@@ -63,20 +63,22 @@ export default {
       }
     },
     series() {
-      const { ftoInvest } = this.$store.getters.copilot.efficiency.chipOee;
+      // console.log('aaaaaaaa', this.$store.getters.copilot.efficiency.chipOee);
+      const { chipOee } = this.$store.getters.copilot.efficiency;
       let dataList = null;
-
       switch (this.period) {
         case "日":
         case "周":
-          dataList = ftoInvest?.current;
+          dataList = chipOee?.current;
+        case "周":
+          dataList = chipOee?.current;
           break;
         default:
           dataList = [];
-          dataList[0] = ftoInvest?.pervious;
-          dataList[1] = ftoInvest?.current;
+          dataList[0] = chipOee?.previous;
+          dataList[1] = chipOee?.current;
       }
-
+      // console.log(dataList)
       return getTemplate(this.period, dataList);
     },
   },
@@ -86,6 +88,7 @@ export default {
 function getTemplate(period, dataList) {
   const year = new Date().getFullYear();
   const month = new Date().getMonth() + 1;
+  console.log('11111', dataList);
   return period == "日" || period == "周"
     ? [
         {

src/views/copilot/efficiency/components/StdRate.vue

@@ -1,20 +1,18 @@
-<!-- 
-    filename: StdRate.vue
-    author: liubin
-    date: 2024-04-29 08:50:43
-    description: 标准组件良率
+<!--
+ * @Author: zhp
+ * @Date: 2024-05-07 10:25:10
+ * @LastEditTime: 2024-05-08 15:55:24
+ * @LastEditors: zhp
+ * @Description:
 -->
 
 <template>
   <div class="std-rate">
     <div class="span-2">
-      <StdRateItem :city="cities[5]" />
+      <StdRateItem :period="period" :city="cities[5]" />
     </div>
-    <div
-      v-for="item in cities.filter((val, index) => index != 5)"
-      :key="item.name"
-    >
-      <StdRateItem :city="item" />
+    <div v-for="item in cities.filter((val, index) => index != 5)" :key="item.name">
+      <StdRateItem :period="period" :city="item" />
     </div>
   </div>
 </template>
@@ -24,7 +22,12 @@ import StdRateItem from "./sub/std/StdRateItem.vue";
 export default {
   name: "StdRate",
   components: { StdRateItem },
-  props: {},
+  props: {
+    period: {
+      type: String,
+      default: "日",
+    },
+  },
   data() {
     return {
       cities: [
@@ -38,7 +41,9 @@ export default {
       ],
     };
   },
-  computed: {},
+  computed: {
+
+  },
   methods: {},
 };
 </script>
@@ -48,7 +53,7 @@ export default {
   display: grid;
   gap: 8px;
   grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(4, 1fr);
+  grid-template-rows: repeat(1, 1fr);
 }
 
 .span-2 {

src/views/copilot/efficiency/components/TransformRate.vue

@@ -1,4 +1,4 @@
-<!-- 
+<!--
     filename: TransformRate.vue
     author: liubin
     date: 2024-04-29 08:50:34
@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import BarChartBase from "@/views/copilot/components/BarChartBase.vue";
+import BarChartBase from "@/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue";
 export default {
   name: "TransformRate",
   components: { BarChartBase },
@@ -63,18 +63,18 @@ export default {
       }
     },
     series() {
-      const { ftoInvest } = this.$store.getters.copilot.yield;
+      const { transformRate } = this.$store.getters.copilot.efficiency;
       let dataList = null;
 
       switch (this.period) {
         case "日":
         case "周":
-          dataList = ftoInvest?.current;
+          dataList = transformRate?.current;
           break;
         default:
           dataList = [];
-          dataList[0] = ftoInvest?.pervious;
-          dataList[1] = ftoInvest?.current;
+          dataList[0] = transformRate?.previous;
+          dataList[1] = transformRate?.current;
       }
 
       return getTemplate(this.period, dataList);

src/views/copilot/efficiency/components/sub/bar/BarChartChipOEE.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 13:22:43
- * @LastEditTime: 2024-05-07 13:29:55
+ * @LastEditTime: 2024-05-08 15:52:09
  * @LastEditors: zhp
  * @Description:
 -->
@@ -18,7 +18,7 @@
     </div>
     <div
       ref="chart"
-      style="max-width: 50vw"
+      style="max-width: 40vw"
       :style="{ height: vHeight + 'vh' }"
     ></div>
   </chart-container>
@@ -198,7 +198,8 @@ export default {
         this.initOptions(this.options);
         return;
       }
-      const actualOptions = JSON.parse(JSON.stringify(this.options));
+      console.log(val)
+      const actualOptions = JSON.parse(JSON.stringify(this.options))
       actualOptions.series[0].data = val[0].data;
       actualOptions.series[0].name = val[0].name;
       actualOptions.series[1].data = val?.[1]?.data || [];

src/views/copilot/efficiency/components/sub/chip/ChipRateItem.vue

@@ -192,4 +192,4 @@ export default {
   }
 }
 </style>
-l
+

src/views/copilot/efficiency/components/sub/std/CityName.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: CityName.vue
     author: liubin
     date: 2024-04-10 08:59:28
-    description: 
+    description:
 -->
 
 <template>

src/views/copilot/efficiency/components/sub/std/ProgressBar.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: ProgressBar.vue
     author: liubin
     date: 2024-04-29 09:18:30
-    description: 
+    description:
 -->
 
 <template>

src/views/copilot/efficiency/components/sub/std/StdRateItem.vue

@@ -1,20 +1,38 @@
-<!-- 
-    filename: StdRateItem.vue
-    author: liubin
-    date: 2024-04-29 08:59:33
-    description: 
+<!--
+ * @Author: zhp
+ * @Date: 2024-05-07 10:25:10
+ * @LastEditTime: 2024-05-08 14:54:24
+ * @LastEditors: zhp
+ * @Description:
 -->
 
 <template>
-  <div class="std-rate-item">
+  <div v-if="period == '日'" class="std-rate-item">
     <CityName :value="city.name" />
     <div class="std-rate-item__value">
-      <ProgressBar title="24年目标" :total="city.target" :value="city.target" />
-      <ProgressBar
-        title="24年累计"
-        :total="city.target"
-        :value="city.thisYear"
-      />
+      <ProgressBar :title="title" :total="city.target" :value="city.target" />
+      <!-- <ProgressBar title="24年累计" :total="city.target" :value="city.thisYear" /> -->
+    </div>
+  </div>
+  <div v-else-if="period == '周'" class="std-rate-item">
+    <CityName :value="city.name" />
+    <div class="std-rate-item__value">
+      <ProgressBar :title="title" :total="city.target" :value="city.target" />
+      <!-- <ProgressBar title="24年累计" :total="city.target" :value="city.thisYear" /> -->
+    </div>
+  </div>
+  <div v-else-if="period == '月'" class="std-rate-item">
+    <CityName :value="city.name" />
+    <div class="std-rate-item__value">
+      <ProgressBar :title="titleEnd" :total="city.target" :value="city.target" />
+      <ProgressBar :title="title" :total="city.target" :value="city.thisYear" />
+    </div>
+  </div>
+  <div v-else="period == '年'" class="std-rate-item">
+    <CityName :value="city.name" />
+    <div class="std-rate-item__value">
+      <ProgressBar :title="titleEnd" :total="city.target" :value="city.target" />
+      <ProgressBar :title="title" :total="city.target" :value="city.thisYear" />
     </div>
   </div>
 </template>
@@ -31,9 +49,55 @@ export default {
       type: Object,
       required: true,
     },
+    period: {
+      type: String,
+      default: "日",
+    }
   },
   data() {
-    return {};
+    return {
+      showDay:true,
+    };
+  },
+  computed: {
+    title() {
+      switch (this.period) {
+        case "日":
+          return "今日"
+        case "周":
+          return  "本周"
+        case "月":
+          const year = new Date().getFullYear();
+          const month = new Date().getMonth() + 1;
+          return `${year - 1}年${month}月累计`
+        case "年": {
+          const year = new Date().getFullYear();
+          // return [
+           return `${year - 1}年累计`
+          // ];
+        }
+        default:
+         return "今日"
+      }
+    },
+    titleEnd() {
+      switch (this.period) {
+        // case "日":
+        //   return "今日"
+        // case "周":
+        //   return "本周"
+        case "月":
+          const year = new Date().getFullYear();
+          const month = new Date().getMonth() + 1;
+          return  `${year}年${month}月目标`
+        case "年": {
+          const year = new Date().getFullYear();
+          // return [
+          return  `${year}年目标`
+          // ];
+        }
+      }
+    }
   },
 };
 </script>

src/views/copilot/efficiency/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-07 10:04:53
- * @LastEditTime: 2024-05-07 10:25:55
+ * @LastEditTime: 2024-05-08 15:58:14
  * @LastEditors: zhp
  * @Description:
 -->
@@ -74,7 +74,7 @@ export default {
   display: grid;
   gap: 16px;
   grid-template-columns: 1fr 1fr;
-  grid-template-rows: 1fr 1fr;
+  grid-template-rows: .5fr .5fr;
 }
 
 .efficiency-copilot > div {

src/views/copilot/energy/components/StockMonitor.vue

@@ -1,8 +1,9 @@
-<!-- 
-    filename: StockMonitor.vue
-    author: liubin
-    date: 2024-04-29 16:35:40
-    description: 仓库监控·当前
+<!--
+ * @Author: zhp
+ * @Date: 2024-05-07 10:25:10
+ * @LastEditTime: 2024-05-08 09:39:15
+ * @LastEditors: zhp
+ * @Description:
 -->
 
 <template>
@@ -25,15 +26,15 @@ export default {
   data() {
     return {
       dhgList: [
-        { name: "总库存", value: "1000" },
-        { name: "已用库存", value: "500" },
-        { name: "剩余库存", value: "500" },
+        { name: "总库存", value: 1000 },
+        { name: "已用库存", value: 500 },
+        { name: "剩余库存", value: 500 },
       ],
       otherList: [
-        { name: "分类1", value: "1000" },
-        { name: "分类2", value: "1000" },
-        { name: "分类3", value: "1000" },
-        { name: "分类4", value: "1000" },
+        { name: "分类1", value: 1000 },
+        { name: "分类2", value: 1000 },
+        { name: "分类3", value: 1000 },
+        { name: "分类4", value: 1000 },
       ],
     };
   },

src/views/copilot/energy/components/sub/monitor/MonitorItem.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: ChipRateItem.vue
     author: liubin
     date: 2024-04-29 14:25:18
-    description: 
+    description:
 -->
 
 <template>
@@ -12,9 +12,12 @@
     </div>
     <div class="chart" ref="chart"></div>
     <div class="legend" v-if="1">
-      <div class="legend-item" v-for="lgd in legendList" :key="lgd.name">
-        <span class="legend-item__label">{{ lgd.name }}</span>
-        <span class="legend-item__value">{{ lgd.value }}</span>
+      <div class="legend-item" v-for="(lgd,index) in legendList" :key="lgd.name">
+        <div >
+          <span :style="'backgroundColor:' + colors[index%5]" class="legend-item__chart"></span>
+          <span :style="'color:' + colors[index%5]" class="legend-item__label">{{ lgd.name }}</span>
+        </div>
+        <div :style="'color:' + colors[index%5]" class="legend-item__value">{{ lgd.value }}</div>
       </div>
     </div>
   </div>
@@ -47,6 +50,7 @@ export default {
   data() {
     return {
       period: "月",
+      colors:['#2760FF', '#5996F7', '#8BC566', '#11FAF0', '#F3C000'],
       valueTuple: [100, 100, 200],
     };
   },
@@ -54,19 +58,23 @@ export default {
     options() {
       const year = new Date().getFullYear();
       const month = new Date().getMonth() + 1;
-      const vt = this.valueTuple;
-      let titleValue =
-          vt[0] != null && vt[2] != null && vt[2] !== 0
-            ? `${((vt[1] / vt[2]) * 100).toFixed(0)}%`
-            : "0%",
-        subtitle =
-          this.period == "月" ? `${month}月累计产出` : `${year}年累计产出`;
+      let arr = []
+      this.legendList.forEach(ele => {
+        arr.push(ele.value)
+      });
+      let vt = arr
+      console.log(arr)
+      let titleValue = vt.reduce(function (prev, cur, index, arr) {
+        return prev + cur
+      })
+      let subtitle = `总计/片`;
 
       return getOptions({
         single: true,
         color: this.color == 1 ? "#4CF0E8" : "#1065ff",
         titleValue,
         subtitle,
+        dataList:this.legendList,
         previousSum: this.valueTuple[0],
         currentSum: this.valueTuple[1],
         targetSum: this.valueTuple[2],
@@ -107,27 +115,31 @@ export default {
   .legend {
     height: 80px;
     display: flex;
-    gap: 40px;
+    gap: 20px;
     justify-content: space-around;
   }
 
   .legend-item {
     display: flex;
+    // width: 90px;
     flex-direction: column;
+    // justify-content: space-around;
+    // justify-content: space-between;
     align-items: center;
+    flex-wrap: wrap;
     gap: 3px;
-
-    &:first-child {
-      .legend-item__value {
-        color: #0e61f5;
-      }
+    .legend-item__chart{
+      display: inline-block;
+      width: 14px;
+      height: 14px;
+      background: #2760FF;
+      border-radius: 2px;
+      // margin-right: 8px;
     }
-
-    &:nth-child(2) {
-      .legend-item__value {
-        color: #0fd5d1;
-      }
+   .legend-item__label {
+      margin-left: 8px;
     }
+    // }
   }
 
   .legend-item__value {

src/views/copilot/energy/index.vue

@@ -1,22 +1,23 @@
-<!-- 
-    filename: index.vue
-    author: liubin
-    date: 2024-04-16 14:40:15
-    description: 综合驾驶舱
+<!--
+ * @Author: zhp
+ * @Date: 2024-05-07 10:25:10
+ * @LastEditTime: 2024-05-08 15:29:28
+ * @LastEditors: zhp
+ * @Description:
 -->
 
 <template>
   <div class="energy-copilot">
-    <Container title="仓库监控·当前" icon="chip2">
+    <Container title="仓库监控·当前" icon="ware">
       <StockMonitorVue :period="period" />
     </Container>
-    <Container title="天然气能耗" icon="std">
+    <Container title="天然气能耗" icon="gas">
       <NatGasVue :period="period" />
     </Container>
-    <Container title="电能耗" icon="chip">
+    <Container title="电能耗" icon="flash">
       <ElecCostVue :period="period" />
     </Container>
-    <Container title="水能耗" icon="cube">
+    <Container title="水能耗" icon="water">
       <WaterCostVue :period="period" />
     </Container>
   </div>
@@ -73,7 +74,7 @@ export default {
   display: grid;
   gap: 16px;
   grid-template-columns: 1fr 1fr;
-  grid-template-rows: 1fr 1fr;
+  /* grid-template-rows: 1fr 1fr; */
 }
 
 .energy-copilot > div {

src/views/copilot/energy/options/monitorOptions.js

@@ -1,156 +1,84 @@
+/*
+ * @Author: zhp
+ * @Date: 2024-05-07 10:25:10
+ * @LastEditTime: 2024-05-08 10:30:06
+ * @LastEditors: zhp
+ * @Description:
+ */
 export default function ({
   single = false,
-  color,
+  colors = ['#2760FF', '#5996F7', '#8BC566', '#11FAF0','#F3C000'],
   titleValue,
   subtitle,
+  dataList,
   previousSum,
   currentSum,
   targetSum,
 }) {
   return {
-    grid: {
-      left: 0,
-      right: 0,
-      bottom: 0,
-      top: 0,
-      containLabel: true,
+  grid: {
+    left: 0,
+    right: 0,
+    bottom: 0,
+    top: 0,
+    containLabel: true,
+  },
+  // tooltip: {},
+  title: {
+    text: titleValue,
+    left: "49%",
+    top: "39%",
+    textAlign: "center",
+    textStyle: {
+      fontWeight: 600,
+      fontSize: 32,
+      color: "#fffd",
     },
-    tooltip: {},
-    title: {
-      text: titleValue,
-      left: "49%",
-      top: "39%",
-      textAlign: "center",
-      textStyle: {
-        fontWeight: 600,
-        fontSize: 32,
-        color: "#fffd",
-      },
-      subtext: `\u2002${subtitle}\u2002`,
-      subtextStyle: {
-        fontSize: 14,
-        fontWeight: 100,
-        color: "#fffd",
-        align: "right",
-      },
+    subtext: `\u2002${subtitle}\u2002`,
+    subtextStyle: {
+      fontSize: 14,
+      fontWeight: 100,
+      color: "#fffd",
+      align: "right",
     },
-    series: [
-      // 背景 series
-      {
-        type: "pie",
-        name: "当前目标",
-        radius: ["70%", "85%"],
-        center: ["50%", "52%"],
-        emptyCircleStyle: {
-          color: "#040c5f45",
-        },
-      },
-      // 数据 series
-      {
-        type: "pie",
-        radius: ["70%", "85%"],
-        center: ["50%", "52%"],
-        avoidLabelOvervlap: false,
-        label: {
-          show: false,
-        },
+  },
+  // legend: {
+  //   top: '5%',
+  //   left: 'center'
+  // },
+  series: [
+    {
+      name: 'Access From',
+      type: 'pie',
+    	// center: ['50%', '40%'],
+			radius: ['60%', '90%'],
+      avoidLabelOverlap: false,
         labelLine: {
-          show: false,
-        },
-        data: [
-          {
-            value: currentSum,
-            name: "当前累计产出",
-            selected: false,
-            itemStyle: {
-              borderJoin: "round",
-              borderCap: "round",
-              borderWidth: 12,
-              borderRadius: "50%",
-              // color: {
-              //   type: "linear",
-              //   x: 1,
-              //   y: 0,
-              //   x2: 0,
-              //   y2: 1,
-              //   colorStops: single
-              //     ? [
-              //         { offset: 0, color: `${color}11` },
-              //         { offset: 1, color: `${color}` },
-              //       ]
-              //     : [
-              //         { offset: 0, color: "#4CF0E811" },
-              //         { offset: 1, color: "#4CF0E8" },
-              //       ],
-              // },
-            },
-          },
-          {
-            value:
-              targetSum > currentSum
-                ? targetSum - currentSum
-                : targetSum == 0
-                ? currentSum == 0
-                  ? 1
-                  : 0
-                : 0,
-
-            name: "未达成累计",
-            itemStyle: { color: "transparent" },
-            label: { show: false },
-          },
-        ],
+        show: false
+      },
+      label: {
+        show: false
       },
-      // 数据 series2 - 2023累计
-      single
-        ? null
-        : {
-            type: "pie",
-            radius: ["55%", "70%"],
-            center: ["50%", "52%"],
-            avoidLabelOvervlap: false,
-            label: {
-              show: false,
-            },
-            labelLine: {
-              show: false,
-            },
-            data: [
-              {
-                value: previousSum,
-                name: "上期累计产出",
-                selected: false,
-                itemStyle: {
-                  borderJoin: "round",
-                  borderCap: "round",
-                  borderWidth: 12,
-                  borderRadius: "50%",
-                  // color: {
-                  //   type: "linear",
-                  //   x: 1,
-                  //   y: 0,
-                  //   x2: 0,
-                  //   y2: 1,
-                  //   colorStops: [
-                  //     { offset: 0, color: "#1065ff66" },
-                  //     { offset: 1, color: "#1065ff" },
-                  //   ],
-                  // },
-                },
-              },
-              {
-                value:
-                  targetSum > previousSum
-                    ? targetSum - previousSum
-                    : previousSum == 0
-                    ? 1
-                    : 0,
-                name: "-",
-                itemStyle: { color: "transparent" },
-                label: { show: false },
-              },
-            ],
-          },
-    ],
+      data: dataList && dataList.length > 0 && dataList.map((item, index) => ({
+						name:item.name,
+            value: item.value,
+
+						itemStyle:{
+							color:{
+								type: 'linear',
+								x: 0,
+								y: 0,
+								x2: 0,
+								y2: 1,
+								global: false,
+								colorStops:[
+									{offset: 0,color:colors[index%5]},
+									{offset: 1,color:colors[index%5]+'33'}
+								]
+							}
+						}
+            }))
+    }
+  ]
   };
 }

src/views/copilot/yield/components/ChipInvest.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: FtoInvest.vue
     author: liubin
     date: 2024-04-10 08:59:28
-    description: 
+    description:
 -->
 
 <template>
@@ -73,7 +73,7 @@ export default {
           break;
         default:
           dataList = [];
-          dataList[0] = chipInvest?.pervious;
+          dataList[0] = chipInvest?.previous;
           dataList[1] = chipInvest?.current;
       }
       return getTemplate(this.period, dataList);

src/views/copilot/yield/components/FtoInvest.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: FtoInvest.vue
     author: liubin
     date: 2024-04-10 08:59:28
-    description: 
+    description:
 -->
 
 <template>
@@ -74,7 +74,7 @@ export default {
           break;
         default:
           dataList = [];
-          dataList[0] = ftoInvest?.pervious;
+          dataList[0] = ftoInvest?.previous;
           dataList[1] = ftoInvest?.current;
       }
 

src/views/copilot/yield/components/sub/ring/DoubleRingChart.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: DoubleRingChart.vue
     author: liubin
     date: 2024-04-17 11:01:55
-    description: 
+    description:
 -->
 
 <template>
@@ -70,6 +70,7 @@ export default {
       // [previousValue, currentValue, sumValue?]
       const getter = this.$store.getters.copilot.yield[this.dataSourceField];
       if (this.period === "日" || this.period === "周") {
+        console.log(this.period)
         return [
           getter.previous[this.factoryId],
           getter.current[this.factoryId],

src/views/copilot/yield/index.vue

@@ -1,4 +1,4 @@
-<!-- 
+<!--
     filename: index.vue
     author: liubin
     date: 2024-04-16 14:40:15

src/views/index.vue

@@ -210,14 +210,6 @@ export default {
   },
 };
 </script>
-
-<style>
-.hideSidebar.mobile .dashboard-factory-all {
-  left: 0 !important;
-  width: 100vw !important;
-}
-</style>
-
 <style lang="scss" scoped>
 .dashboard-factory-all {
   background: #151516;
@@ -271,9 +263,9 @@ export default {
   z-index: 9998;
   width: 1.702vw;
   height: 1.702vw;
-  /* 
+  /*
   width: 32px;
-  height: 32px; 
+  height: 32px;
   */
   background: url(../assets/pinicon.png) no-repeat 0 0 / 100% 100%;
   transition: transform 0.1s linear;

src/views/playground.vue

@@ -1,4 +1,4 @@
-<!-- 
+<!--
     filename: playground.vue
     author: liubin
     date: 2024-04-02 09:42:43