From c04bcbf90ec3471bd6a18cfdf416932cc5cb66f8 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Fri, 19 Aug 2022 13:54:37 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E7=BB=84=E4=BB=B6=E5=81=9A?=
 =?UTF-8?q?=E4=B8=80=E4=B8=8B=E5=88=87=E5=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bigscreen/designer/components/preview.vue |   5 -
 .../bigscreen/viewer/AppGigscreenViewer.vue   |   2 -
 packages/core/AppAccount/AppAccount.vue       |   2 -
 packages/core/AppMenuManager/introPage.vue    |   3 -
 project/dv/apps/AppGridDV.vue                 |   9 +-
 project/dv/apps/components/chartOps.js        | 187 ++++++++++++++++++
 6 files changed, 190 insertions(+), 18 deletions(-)
 create mode 100644 project/dv/apps/components/chartOps.js

diff --git a/packages/bigscreen/designer/components/preview.vue b/packages/bigscreen/designer/components/preview.vue
index 94c3504a..66a22c9b 100644
--- a/packages/bigscreen/designer/components/preview.vue
+++ b/packages/bigscreen/designer/components/preview.vue
@@ -12,13 +12,8 @@
 </template>
 
 <script>
-import AppGigscreenViewer from "../../viewer/AppGigscreenViewer";
-import AiDvWrapper from "../../../../components/layout/AiDvWrapper/AiDvWrapper";
-import AiDvBackground from "../../../../components/layout/AiDvBackground";
-
 export default {
   name: "preview",
-  components: {AiDvBackground, AiDvWrapper, AppGigscreenViewer},
   props: {
     instance: Function,
     dict: Object,
diff --git a/packages/bigscreen/viewer/AppGigscreenViewer.vue b/packages/bigscreen/viewer/AppGigscreenViewer.vue
index c6c26f5a..48e0d151 100644
--- a/packages/bigscreen/viewer/AppGigscreenViewer.vue
+++ b/packages/bigscreen/viewer/AppGigscreenViewer.vue
@@ -23,10 +23,8 @@
 
 <script>
 
-import AiDvRender from "../../../components/AiDvRender";
 export default {
   name: 'AppGigscreenViewer',
-  components: {AiDvRender},
   label: '大屏预览',
   props: {
     instance: Function,
diff --git a/packages/core/AppAccount/AppAccount.vue b/packages/core/AppAccount/AppAccount.vue
index 770d2632..a595f76f 100644
--- a/packages/core/AppAccount/AppAccount.vue
+++ b/packages/core/AppAccount/AppAccount.vue
@@ -72,11 +72,9 @@
 
 <script>
 import {mapState} from "vuex";
-import AiAddressBookMenu from "../../../components/AiAddressBookMenu";
 
 export default {
   name: "AppAccount",
-  components: {AiAddressBookMenu},
   label: "账号管理(村微版)",
   props: {
     instance: Function,
diff --git a/packages/core/AppMenuManager/introPage.vue b/packages/core/AppMenuManager/introPage.vue
index 92dc2f6d..85468134 100644
--- a/packages/core/AppMenuManager/introPage.vue
+++ b/packages/core/AppMenuManager/introPage.vue
@@ -33,11 +33,8 @@
 </template>
 
 <script>
-
-import AiEditBtn from "../../../components/AiEditBtn";
 export default {
   name: "introPage",
-  components: {AiEditBtn},
   props: {
     instance: Function,
     dict: {default: () => ({})}
diff --git a/project/dv/apps/AppGridDV.vue b/project/dv/apps/AppGridDV.vue
index 4307f91e..963b2daf 100644
--- a/project/dv/apps/AppGridDV.vue
+++ b/project/dv/apps/AppGridDV.vue
@@ -57,7 +57,7 @@
           <ai-echart
               style="height: 100%; width: 100%;"
               :data="eventInfo"
-              :ops="pieChart">
+              :ops="pieChart2">
           </ai-echart>
         </div>
       </div>
@@ -89,16 +89,13 @@
 </template>
 
 <script>
-import pieChart from '../../../components/AiEchart/template/pie/pieChart2'
-import barChart1 from '../../../components/AiEchart/template/bar/barChart1'
+import {barChart1, pieChart2} from "./components/chartOps"
 import {VueOkrTree} from 'vue-okr-tree'
 import 'vue-okr-tree/dist/vue-okr-tree.css'
 
 export default {
   name: 'AppGridDV',
-
   label: '网格数据大屏',
-
   props: {
     instance: Function,
     dict: Object,
@@ -115,7 +112,7 @@ export default {
       barChart1,
       userInfo: [],
       eventInfo: [],
-      pieChart,
+      pieChart2,
       total: 0,
       isShowInfo: false,
       defaultProps: {
diff --git a/project/dv/apps/components/chartOps.js b/project/dv/apps/components/chartOps.js
new file mode 100644
index 00000000..20b36517
--- /dev/null
+++ b/project/dv/apps/components/chartOps.js
@@ -0,0 +1,187 @@
+export const pieChart2 = {
+  legend: {
+    bottom: 0,
+    itemGap: 14,
+    itemWidth: 16,
+    itemHeight: 5,
+    textStyle: {color: "#fff", fontSize: 14}
+  },
+  grid: {
+    height: 260
+  },
+  xAxis: {show: false},
+  yAxis: {show: false},
+  tooltip: {
+    backgroundColor: "rgba(14, 51, 111, 0.9)",
+    borderColor: "#1A6ABC",
+    textStyle: {color: "#fff"}
+  },
+  series: {
+    type: "pie",
+    minShowLabelAngle: 10,
+    radius: [70, 81],
+    itemStyle: {
+      borderColor: "#fff",
+      borderWidth: 2
+    },
+    label: {
+      color: "#A8D7F3",
+      fontSize: 14,
+      formatter: "{name|{b}}\n{v|{d}%}",
+      minMargin: 5,
+      edgeDistance: 10,
+      lineHeight: 22,
+      rich: {
+        v: {
+          color: "#fff"
+        }
+      }
+    },
+    labelLine: {},
+    labelLayout: function (params) {
+      let points = params.labelLinePoints,
+          isLeft = points[2][0] < points[1][0]
+      points[2][0] =
+          points[2][0] + (params.labelRect.width + 4) * (isLeft ? -1 : 1)
+      return {
+        labelLinePoints: points
+      }
+    }
+  },
+  render: (h, params) => {
+    const formatNum = num => {
+      if (num >= 10000000) {
+        return num / 10000000 + "千万"
+      }
+
+      if (num >= 10000) {
+        return num / 10000 + "万"
+      }
+
+      return parseFloat(num.toFixed(2))
+    }
+
+    let total = params.data.reduce((t, e) => {
+      return t + Number(Object.values(e)?.[1] || 0)
+    }, 0)
+    return h(
+        "div",
+        {
+          style: {
+            height: "162px",
+            width: "162px",
+            color: "#8BCCFF",
+            left: "50%",
+            top: "50%",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            flexDirection: "column",
+            position: "absolute",
+            transform: "translate(-50%,-50%)",
+            backgroundImage: `url('https://cdn.cunwuyun.cn/dvcp/dv/tpl/pie2Circle.png')`,
+            backgroundPosition: "center"
+          }
+        },
+        [
+          h(
+              "span",
+              {style: {fontSize: "28px", color: "#fff", fontFamily: "DIN"}},
+              formatNum(total)
+          ),
+          h("span", null, "总量")
+        ]
+    )
+  }
+}
+export const barChart1 = {
+  legend: {
+    right: 0,
+    itemHeight: 5,
+    itemWidth: 16,
+    textStyle: { color: '#fff' }
+  },
+  yAxis: {
+    nameGap: 23,
+    minInterval: 1,
+    splitLine: { lineStyle: { color: 'rgba(255,255,255,.2)', type: 'dashed' } },
+    axisLabel: { color: '#fff' },
+    axisPointer: { show: false }
+  },
+  axisPointer: {
+    type: 'shadow',
+    triggerTooltip: false,
+    shadowStyle: { color: 'rgba(46, 153, 255, .2)' }
+  },
+  color: [
+    {
+      type: 'linear',
+      x: 0,
+      x2: 0,
+      y: 0,
+      y2: 1,
+      colorStops: [
+        { offset: 0, color: 'rgba(66, 187, 255, 1)' },
+        { offset: 1, color: 'rgba(37, 143, 255, 0.2)' }
+      ]
+    },
+    {
+      type: 'linear',
+      x: 0,
+      x2: 0,
+      y: 0,
+      y2: 1,
+      colorStops: [
+        { offset: 0, color: 'rgba(66, 255, 254, 1)' },
+        { offset: 1, color: 'rgba(37, 255, 246, 0.2)' }
+      ]
+    },
+    {
+      type: 'linear',
+      x: 0,
+      x2: 0,
+      y: 0,
+      y2: 1,
+      colorStops: [
+        { offset: 0, color: 'rgba(97, 253, 185, 1)' },
+        { offset: 1, color: 'rgba(97, 253, 185, 0.2)' }
+      ]
+    },
+    {
+      type: 'linear',
+      x: 0,
+      x2: 0,
+      y: 0,
+      y2: 1,
+      colorStops: [
+        { offset: 0, color: 'rgba(253, 108, 57, 1)' },
+        { offset: 1, color: 'rgba(253, 108, 57, 0.2)' }
+      ]
+    },
+    {
+      type: 'linear',
+      x: 0,
+      x2: 0,
+      y: 0,
+      y2: 1,
+      colorStops: [
+        { offset: 0, color: 'rgba(248, 187, 25, 1)' },
+        { offset: 1, color: 'rgba(55, 39, 5, 1)' }
+      ]
+    }
+  ],
+  daemon: {
+    type: 'bar',
+    label: {
+      show: true,
+      position: 'top',
+      color: '#fff',
+      formatter: e => {
+        return e.data[e.seriesName] || ''
+      }
+    },
+    barWidth: 16,
+    barCategoryGap: 40,
+    itemStyle: {}
+  }
+}