From 6f6dc79702aa9ace93ddb3ba705c70b371cce772 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Mon, 9 Oct 2023 19:23:39 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BF=BD=E5=8A=A0=E6=AF=9B=E7=8E=BB=E7=92=83?=
 =?UTF-8?q?=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/layout/AiDvSummary/AiDvSummary.vue |   1 -
 .../AiDvSummary/components/Summary5.vue       | 191 +++++++++---------
 2 files changed, 98 insertions(+), 94 deletions(-)

diff --git a/components/layout/AiDvSummary/AiDvSummary.vue b/components/layout/AiDvSummary/AiDvSummary.vue
index 8b66261a..eb4c8026 100644
--- a/components/layout/AiDvSummary/AiDvSummary.vue
+++ b/components/layout/AiDvSummary/AiDvSummary.vue
@@ -88,6 +88,5 @@ export default {
 .AiSummary {
   width: 100%;
   height: 100%;
-  backdrop-filter: blur(1px);
 }
 </style>
diff --git a/components/layout/AiDvSummary/components/Summary5.vue b/components/layout/AiDvSummary/components/Summary5.vue
index 7d56e839..b52050f4 100644
--- a/components/layout/AiDvSummary/components/Summary5.vue
+++ b/components/layout/AiDvSummary/components/Summary5.vue
@@ -17,122 +17,127 @@
 </template>
 
 <script>
-  export default {
-    name: 'summary5',
+export default {
+  name: 'summary5',
 
-    props: {
-      data: {
-        type: Array,
-        default: () => []
-      },
-
-      keys: {
-        type: String,
-        default: 'key'
-      },
-
-      value: {
-        type: String,
-        default: 'value'
-      }
+  props: {
+    data: {
+      type: Array,
+      default: () => []
     },
 
-    data () {
+    keys: {
+      type: String,
+      default: 'key'
+    },
+
+    value: {
+      type: String,
+      default: 'value'
+    }
+  },
+
+  data() {
+    return {
+      img1: require('../asset/summary5-1.png'),
+      img2: require('../asset/summary5-2.png'),
+      img3: require('../asset/summary5-3.png'),
+      img4: require('../asset/summary5-4.png')
+    }
+  },
+
+  methods: {
+    getImg(index) {
       return {
-        img1: require('../asset/summary5-1.png'),
-        img2: require('../asset/summary5-2.png'),
-        img3: require('../asset/summary5-3.png'),
-        img4: require('../asset/summary5-4.png')
-      }
-    },
-
-    methods: {
-      getImg (index) {
-        return {
-          '0': this.img1,
-          '1': this.img2,
-          '2': this.img3,
-          '3': this.img4
-        }[index]
-      }
+        '0': this.img1,
+        '1': this.img2,
+        '2': this.img3,
+        '3': this.img4
+      }[index]
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>
-  .summary5 {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-    height: 100%;
+.summary5 {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  height: 100%;
 
-    div {
-      box-sizing: border-box;
+  div {
+    box-sizing: border-box;
+  }
+
+  .summary5-item {
+    display: flex;
+    position: relative;
+    align-items: center;
+    backdrop-filter: blur(1px);
+
+    .right {
+      min-width: 90px;
     }
 
-    .summary5-item {
+    .left {
       display: flex;
       position: relative;
       align-items: center;
+      justify-content: center;
+      margin-right: 20px;
+      width: 50px;
+      height: 50px;
+      box-shadow: 0 0 8px 4px #0e3a77 inset;
+      background: transparent;
 
-      .right {
-        min-width: 90px;
+      .corner {
+        height: 18px;
+        width: 18px;
+        position: absolute;
+        display: block;
+        background-image: url(./../asset/corner.svg);
+        background-repeat: no-repeat;
       }
 
-      .left {
-        display: flex;
-        position: relative;
-        align-items: center;
-        justify-content: center;
-        margin-right: 20px;
-        width: 50px;
-        height: 50px;
-        box-shadow: 0 0 8px 4px #0e3a77 inset;
-        background: transparent;
-  
-        .corner {
-          height: 18px;
-          width: 18px;
-          position: absolute;
-          display: block;
-          background-image: url(./../asset/corner.svg);
-          background-repeat: no-repeat;
-        }
-        .corner.left-top {
-          left: -6px;
-          top: -6px;
-          transform: rotateY(180deg);
-        }
-        .corner.right-top {
-          right: -6px;
-          top: -6px;
-        }
-        .corner.left-bottom {
-          left: -6px;
-          bottom: -6px;
-          transform: rotateX(180deg) rotateY(180deg);
-        }
-        .corner.right-bottom {
-          right: -6px;
-          bottom: -6px;
-          transform: rotateX(180deg);
-        }
+      .corner.left-top {
+        left: -6px;
+        top: -6px;
+        transform: rotateY(180deg);
       }
 
-      h2 {
-        line-height: 24px;
-        color: #fff;
-        font-size: 16px;
-        font-weight: normal;
+      .corner.right-top {
+        right: -6px;
+        top: -6px;
       }
 
-      p {
-        font-size: 26px;
-        color: #fff;
-        font-weight: 700;
+      .corner.left-bottom {
+        left: -6px;
+        bottom: -6px;
+        transform: rotateX(180deg) rotateY(180deg);
+      }
+
+      .corner.right-bottom {
+        right: -6px;
+        bottom: -6px;
+        transform: rotateX(180deg);
       }
     }
+
+    h2 {
+      line-height: 24px;
+      color: #fff;
+      font-size: 16px;
+      font-weight: normal;
+    }
+
+    p {
+      font-size: 26px;
+      color: #fff;
+      font-weight: 700;
+    }
   }
+}
 </style>