update Home

package.json

@@ -53,6 +53,7 @@
     "highlight.js": "^11.9.0",
     "js-beautify": "^1.15.1",
     "jsencrypt": "3.3.1",
+    "mockjs": "^1.1.0",
     "moment": "^2.30.1",
     "nprogress": "0.2.0",
     "quill": "^1.3.7",

src/views/copilot/efficiency/index.vue

@@ -0,0 +1,27 @@
+<!-- 
+    filename: index.vue
+    author: liubin
+    date: 2024-04-16 14:40:15
+    description: 效率驾驶舱
+-->
+
+<template>
+  <div class="copilot-container efficiency-copilot">
+    效率驾驶舱
+  </div>
+</template>
+
+<script>
+export default {
+  name: "EfficiencyCopilot",
+  components: {},
+  props: {},
+  data() {
+    return {};
+  },
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style scoped></style>

src/views/copilot/energy/index.vue

@@ -0,0 +1,27 @@
+<!-- 
+    filename: index.vue
+    author: liubin
+    date: 2024-04-16 14:40:15
+    description: 能源驾驶舱
+-->
+
+<template>
+  <div class="copilot-container energy-copilot">
+    能源驾驶舱
+  </div>
+</template>
+
+<script>
+export default {
+  name: "EnergyCopilot",
+  components: {},
+  props: {},
+  data() {
+    return {};
+  },
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style scoped></style>

src/views/copilot/yield/index.vue

@@ -0,0 +1,25 @@
+<!-- 
+    filename: index.vue
+    author: liubin
+    date: 2024-04-16 14:40:15
+    description: 产量驾驶舱
+-->
+
+<template>
+  <div class="copilot-container yield-copilot">产量驾驶舱</div>
+</template>
+
+<script>
+export default {
+  name: "YieldCopilot",
+  components: {},
+  props: {},
+  data() {
+    return {};
+  },
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style scoped></style>

src/views/dashboard/charts/Fto.vue

@@ -50,5 +50,8 @@ export default {
       ],
     },
   },
+  mounted() {
+    console.log("FTO created...");
+  },
 };
 </script>

src/views/dashboard/components/Container.vue

@@ -7,6 +7,26 @@
 
 <template>
   <div class="dashboard-container">
+    <!-- refresh btn  -->
+    <button
+      style="appearance: none; outline: none; border: none; background: none; color:#fff; cursor: pointer; position: absolute; top: 8px; right: 8px"
+      @click="$emit('refresh')"
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke-width="1.5"
+        stroke="currentColor"
+        style="width: 24px; height: 24px"
+      >
+        <path
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99"
+        />
+      </svg>
+    </button>
     <!-- decoration  -->
     <div class="corner tl"></div>
     <div class="corner tr"></div>

src/views/index.vue

@@ -5,26 +5,45 @@
         <db-header class="db-header"></db-header>
         <div class="db-body">
           <div class="db-left">
-            <db-container icon="cube" title="FTO投入">
-              <fto-chart />
+            <db-container
+              icon="cube"
+              title="FTO投入"
+              @refresh="() => (ftoKey = Math.random())"
+            >
+              <fto-chart :key="ftoKey" />
             </db-container>
-            <db-container icon="chip2" title="芯片投入">
-              <chip-invest-chart />
+            <db-container
+              icon="chip2"
+              title="芯片投入"
+              @refresh="() => (chipInvestKey = Math.random())"
+            >
+              <chip-invest-chart :key="chipInvestKey" />
             </db-container>
           </div>
           <div class="db-right">
-            <db-container side="right" icon="chip" title="芯片产出">
-              <chip-yield-chart />
+            <db-container
+              side="right"
+              icon="chip"
+              title="芯片产出"
+              @refresh="() => (chipYieldKey = Math.random())"
+            >
+              <chip-yield-chart :key="chipYieldKey" />
             </db-container>
             <db-container
               side="right"
               icon="std"
               title="标准组件产出"
+              @refresh="() => (stdKey = Math.random())"
             >
-              <std-chart />
+              <std-chart :key="stdKey" />
             </db-container>
-            <db-container side="right" icon="bipv" title="BIPV产出">
-              <bipv-chart />
+            <db-container
+              side="right"
+              icon="bipv"
+              title="BIPV产出"
+              @refresh="() => (bipvKey = Math.random())"
+            >
+              <bipv-chart :key="bipvKey" />
             </db-container>
           </div>
         </div>
@@ -83,6 +102,11 @@ export default {
     return {
       visible: false,
       hintPosition: null,
+      ftoKey: Math.random(),
+      chipInvestKey: Math.random(),
+      chipYieldKey: Math.random(),
+      stdKey: Math.random(),
+      bipvKey: Math.random(),
     };
   },
   mounted() {