From c7487a244265d183b1dcfca93aac327b87a475a8 Mon Sep 17 00:00:00 2001
From: gongjiale <942894820@qq.com>
Date: Mon, 28 Nov 2022 17:28:05 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ReservoirBottom.vue            |  23 +++-
 .../assertReport/components/ReservoirLeft.vue |  53 +++++++-
 .../components/ReservoirRight.vue             | 125 +++++++++++++++---
 .../components/ReservoirThumbnail.vue         |   4 +-
 front/src/views/assertReport/index.vue        |  73 +++++-----
 5 files changed, 214 insertions(+), 64 deletions(-)

diff --git a/front/src/views/assertReport/components/ReservoirBottom.vue b/front/src/views/assertReport/components/ReservoirBottom.vue
index b3d17846..7e819dca 100644
--- a/front/src/views/assertReport/components/ReservoirBottom.vue
+++ b/front/src/views/assertReport/components/ReservoirBottom.vue
@@ -48,6 +48,23 @@
   }
   </script>
   <style lang='less' scoped>
+    @keyframes turn {
+    0% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+    25% {
+      border-image: linear-gradient(to bottom, #003194, #00ffea) 1;
+    }
+    50% {
+      border-image: linear-gradient(to left, #003194, #00ffea) 1;
+    }
+    75% {
+      border-image: linear-gradient(to top, #003194, #00ffea) 1;
+    }
+    100% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+  }
   .top5-content::-webkit-scrollbar {
     width: 6px;
     /*height: 4px;*/
@@ -91,7 +108,7 @@
       transition: all 100ms ease-out;
       .top {
         font-size: 24px;
-        background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+        background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
         background-size: 100% 100%;
         text-align: center;
   
@@ -125,6 +142,10 @@
         }
       }
     }
+    .platform-overview-bottom:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
   }
   </style>
   
\ No newline at end of file
diff --git a/front/src/views/assertReport/components/ReservoirLeft.vue b/front/src/views/assertReport/components/ReservoirLeft.vue
index 0737c7e3..9293804a 100644
--- a/front/src/views/assertReport/components/ReservoirLeft.vue
+++ b/front/src/views/assertReport/components/ReservoirLeft.vue
@@ -171,6 +171,24 @@ export default {
     color: #f4fcfe; border-color: #107bb0;
       box-shadow: 1px 1px 5px 1px RGB(16, 123, 176, 0.8) inset
       }
+
+  @keyframes turn {
+    0% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+    25% {
+      border-image: linear-gradient(to bottom, #003194, #00ffea) 1;
+    }
+    50% {
+      border-image: linear-gradient(to left, #003194, #00ffea) 1;
+    }
+    75% {
+      border-image: linear-gradient(to top, #003194, #00ffea) 1;
+    }
+    100% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+  }
 .reservoir-survey {
 
 
@@ -181,7 +199,7 @@ export default {
   display: flex;
   flex-direction: column;
 
- 
+
 .platform-overview-top {
    width: 100%;
     height: 3.8rem;
@@ -195,7 +213,7 @@ export default {
     transition: all 100ms ease-out;
     .top {
       font-size: 24px;
-      background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+      background:  url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
       background-size: 100% 100%;
       text-align: center;
     }
@@ -261,6 +279,13 @@ export default {
             }
           }
         }
+        .item:hover {
+         background: linear-gradient(
+            to bottom,
+            rgba(33, 54, 88, 0.7),
+            rgba(33, 54, 88, 0.9)
+          );
+        }
         .item:nth-of-type(1) {
           margin-top: 10px;
           .img {
@@ -283,6 +308,10 @@ export default {
       }
     }
   }
+  .platform-overview-top:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
   .platform-overview-mid {
     margin-top:20px;
     width: 100%;
@@ -297,7 +326,7 @@ export default {
     transition: all 100ms ease-out;
     .top {
       font-size: 24px;
-      background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+      background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
       background-size: 100% 100%;
       text-align: center;
       margin-bottom: 8px;
@@ -334,22 +363,26 @@ export default {
                   text-align: center;
                 }
                 & > span:nth-child(2) {
-                  width: 1.47rem;
+                  width: 1.57rem;
                   padding-left: 0.05rem;
+                  //text-align: center;
                 }
                 & > span:nth-child(3) {
                   width: 1.47rem;
                   padding-left: 0.05rem;
+                 // text-align: center;
                 }
                 & > span:nth-child(4) {
                   width: 0.5rem;
                   padding-left: 0.05rem;
+                  text-align: center;
                 }
                 & > span:last-child {
-                  width: 0.8rem;
+                  width: 0.7rem;
                   color: #1ffefd;
                   text-align: center;
                   border-right: 0;
+                  text-align: center;
                 }
               }
               & > div:first-child {
@@ -360,6 +393,10 @@ export default {
     }
   }
 
+  .platform-overview-mid:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
   .platform-overview-bottom {
     margin-top:20px;
     width: 100%;
@@ -374,7 +411,7 @@ export default {
     transition: all 100ms ease-out;
     .top {
       font-size: 24px;
-      background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+      background: url('~@/assets/capabilityCloud/infrastructure_title.png') no-repeat;
       background-size: 100% 100%;
       text-align: center;
     }
@@ -407,6 +444,10 @@ export default {
    
     }
   }
+  .platform-overview-bottom:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
 }
 
 </style>
diff --git a/front/src/views/assertReport/components/ReservoirRight.vue b/front/src/views/assertReport/components/ReservoirRight.vue
index f576ef04..50fdde13 100644
--- a/front/src/views/assertReport/components/ReservoirRight.vue
+++ b/front/src/views/assertReport/components/ReservoirRight.vue
@@ -12,8 +12,8 @@
           <div class="left-list">
             <div class="left-list1">排行</div>
             <div class="left-list2">部门名称</div>
-            <div class="left-list1">提供资源</div>
-            <div class="left-list1" style="color: #1ffefd">贡献总量</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
           </div>
           <div class="left-list" v-for="(item, index) in top5DistrictList">
             <div class="left-list1" v-if="item.img">
@@ -31,6 +31,60 @@
             </div>
           </div>
         </div>
+        <!-- <div class="bottom-item">
+          <div class="inner-title">
+            <p style="width: 220px">市级部门审评节省资金排行</p>
+          </div>
+          <div class="left-list">
+            <div class="left-list1">排行</div>
+            <div class="left-list2">部门名称</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
+          </div>
+          <div class="left-list" v-for="(item, index) in top5DeptFundList">
+            <div class="left-list1" v-if="item.img">
+              <img :src="item.img" />
+            </div>
+            <div class="left-list1" v-else>{{ index + 1 }}</div>
+            <a-tooltip>
+              <template #title>{{ item.deptName }}</template>
+              <div class="left-list2">{{ item.deptName }}</div>
+            </a-tooltip>
+
+            <div class="left-list1">{{ item.applyCount }}</div>
+            <div class="left-list1" style="color: #1ffefd">
+              {{ item.applyPrice }}
+            </div>
+          </div>
+        </div> -->
+      </div>
+      <div class="bottom1">
+        <!-- <div class="bottom-item">
+          <div class="inner-title">
+            <p style="width: 220px">市级部门共享贡献资金排行</p>
+          </div>
+          <div class="left-list">
+            <div class="left-list1">排行</div>
+            <div class="left-list2">部门名称</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
+          </div>
+          <div class="left-list" v-for="(item, index) in top5DistrictList">
+            <div class="left-list1" v-if="item.img">
+              <img :src="item.img" />
+            </div>
+            <div class="left-list1" v-else>{{ index + 1 }}</div>
+            <a-tooltip>
+              <template #title>{{ item.deptName }}</template>
+              <div class="left-list2">{{ item.deptName }}</div>
+            </a-tooltip>
+
+            <div class="left-list1">{{ item.resourceCount }}</div>
+            <div class="left-list1" style="color: #1ffefd">
+              {{ item.applyPrice }}
+            </div>
+          </div>
+        </div> -->
         <div class="bottom-item">
           <div class="inner-title">
             <p style="width: 220px">市级部门审评节省资金排行</p>
@@ -38,8 +92,8 @@
           <div class="left-list">
             <div class="left-list1">排行</div>
             <div class="left-list2">部门名称</div>
-            <div class="left-list1">提供资源</div>
-            <div class="left-list1" style="color: #1ffefd">贡献总量</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
           </div>
           <div class="left-list" v-for="(item, index) in top5DeptFundList">
             <div class="left-list1" v-if="item.img">
@@ -66,8 +120,8 @@
           <div class="left-list">
             <div class="left-list1">序号</div>
             <div class="left-list2">部门名称</div>
-            <div class="left-list1">提供资源</div>
-            <div class="left-list1" style="color: #1ffefd">贡献总量</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
           </div>
           <div style="height: 300px; overfolw-y: auto">
             <div
@@ -97,8 +151,8 @@
           <div class="left-list">
             <div class="left-list1">序号</div>
             <div class="left-list2">部门名称</div>
-            <div class="left-list1">提供资源</div>
-            <div class="left-list1" style="color: #1ffefd">贡献总量</div>
+            <div class="left-list1">应用数</div>
+            <div class="left-list1" style="color: #1ffefd">贡献金额</div>
           </div>
           <div style="height: 200px; overfolw-y: auto">
             <div
@@ -261,6 +315,23 @@ export default {
 }
 </script>
 <style lang='less' scoped>
+  @keyframes turn {
+    0% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+    25% {
+      border-image: linear-gradient(to bottom, #003194, #00ffea) 1;
+    }
+    50% {
+      border-image: linear-gradient(to left, #003194, #00ffea) 1;
+    }
+    75% {
+      border-image: linear-gradient(to top, #003194, #00ffea) 1;
+    }
+    100% {
+      border-image: linear-gradient(to right, #003194, #00ffea) 1;
+    }
+  }
 .top5-content::-webkit-scrollbar {
   width: 6px;
   /*height: 4px;*/
@@ -302,18 +373,20 @@ export default {
     transition: all 100ms ease-out;
     .top {
       font-size: 24px;
-      background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+      background: url('~@/assets/capabilityCloud/infrastructure_title.png')  no-repeat;
       background-size: 100% 100%;
       text-align: center;
     }
     .bottom1 {
       margin-top: 10px;
-      // margin-top:10px;
       width: 100%;
       display: table;
       justify-content: space-between;
       align-items: center;
-      height: 3.5rem;
+      height: 1.8rem;
+      .bottom-item {
+        width: 98%;
+      }
     }
     .bottom2 {
       margin-top: 10px;
@@ -322,7 +395,10 @@ export default {
       display: table;
       justify-content: space-between;
       align-items: center;
-      height: 5.6rem;
+      height: 4.0rem;
+      .bottom-item {
+        width: 48%;
+      }
     }
 
     :hover.bottom-item {
@@ -331,10 +407,11 @@ export default {
     .bottom-item {
       height: 100%;
       overflow-y: auto;
-      background: rgba(0, 108, 188, 0.4);
+      background: rgba(0, 108, 188, 0.2);
       border-radius: 2px;
-      margin: 5px 5px;
-      width: 48%;
+      margin: 2px 5px;
+      border: 1px solid #10496f;
+     
       .inner-title {
         margin-top: 10px;
         margin-bottom: 10px;
@@ -362,12 +439,12 @@ export default {
         text-align: center;
         color: #fff;
         width: 100%;
-        height: 40px;
+        height: 26px;
         margin-right: 10px;
         margin-top: 5px;
-        font-size: 14px;
+        font-size: 16px;
         .left-list1 {
-          font-size: 14x;
+          font-size: 16x;
           float: left;
           width: 22%;
           height: 0.32rem;
@@ -389,7 +466,7 @@ export default {
           -webkit-box-orient: vertical;
           word-break: break-all;
           cursor: pointer;
-          font-size: 14px;
+          font-size: 16px;
           float: left;
           width: 30%;
           &:hover {
@@ -408,6 +485,10 @@ export default {
       }
     }
   }
+  .platform-overview-top:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
   .platform-overview-bottom {
     margin-top: 20px;
     width: 100%;
@@ -422,7 +503,7 @@ export default {
     transition: all 100ms ease-out;
     .top {
       font-size: 24px;
-      background: url(~@/assets/capabilityCloud/top_bg.png) no-repeat;
+      background: url('~@/assets/capabilityCloud/infrastructure_title.png')  no-repeat;
       background-size: 100% 100%;
       text-align: center;
     }
@@ -454,5 +535,9 @@ export default {
       }
     }
   }
+  .platform-overview-bottom:hover {
+    border: 2px solid;
+    animation: turn 5s linear infinite;
+  }
 }
 </style>
diff --git a/front/src/views/assertReport/components/ReservoirThumbnail.vue b/front/src/views/assertReport/components/ReservoirThumbnail.vue
index 3132f7e1..3d124fbd 100644
--- a/front/src/views/assertReport/components/ReservoirThumbnail.vue
+++ b/front/src/views/assertReport/components/ReservoirThumbnail.vue
@@ -362,8 +362,8 @@ export default {
   background-size: 100% 100%;
   .city-map-content-echarts {
     width: 10rem;
-    height: 8rem;
-    top: 0px;
+    height: 7.9rem;
+    top: 10px;
     left: 500px;
     bottom: 2rem;
     position: absolute;
diff --git a/front/src/views/assertReport/index.vue b/front/src/views/assertReport/index.vue
index 1134f19c..0997458e 100644
--- a/front/src/views/assertReport/index.vue
+++ b/front/src/views/assertReport/index.vue
@@ -8,7 +8,7 @@
       <span class="title" @click="goHome">城市云脑通用能力服务平台</span>
     </div>
     <div class="header1">
-      <div style=" color:#bed1df; font-size: 26px">累计节省财政资金</div>
+      <div style=" color:#bed1df; font-size: 32px">累计节省财政资金</div>
             <div class="area-right">
               <!-- <div class="mianJi">累计节省财政资金</div> -->
               <template v-for="(item, index) in saveMonmy">
@@ -150,40 +150,7 @@ export default {
     background: url('~@/assets/capabilityCloud/bg.png') no-repeat;
     background-size: 100% 100%;
     overflow: hidden;
-    .area-right {
-          display: flex;
-          align-items: center;
-          justify-items: flex-end;
-          padding-right: 20px;
-          color: #bed1df;
-          margin-left: 100px;
-          span {
-            width: 28px;
-            height: 40px;
-            line-height: 40px;
-            background: url("~@/assets/capabilityCloud/num_bg.png")
-            100% 100%;
-            background-size: 100%;
-            text-align: center;
-            font-size: 28px;
-            margin-right: 3px;
-            color: #fff;
-            font-family: DinPro-Bold;
-          }
-          .mianJi {
-            margin-top: 6px;;
-              margin-right: 3px;
-         font-size: 22px;
-         float:right;
-          }
-          p {
-            height: 34px;
-            display: flex;
-            align-items: flex-end;
-            justify-items: center;
-            font-size: 30px;
-          }
-        }
+   
     & > .header {
       height: 1.04rem;
       text-align: center;
@@ -209,6 +176,42 @@ export default {
     align-items: center;
     z-index: 1004;
     text-align: center;
+    .area-right {
+          display: flex;
+          align-items: center;
+          justify-items: flex-end;
+          padding-right: 20px;
+          color: #bed1df;
+          margin-left: 100px;
+          span {
+            width: 36px;
+            // height: 45px;
+            // line-height: 45px;
+            color: #fed93f;
+            font-weight: bold;
+            background: url("~@/assets/capabilityCloud/num_bg.png") 
+            100% 100% no-repeat;
+            background-size: 100%;
+            text-align: center;
+            font-size: 34px;
+            margin-right: 3px;
+
+            font-family: DinPro-Bold;
+          }
+          .mianJi {
+            margin-top: 6px;;
+              margin-right: 3px;
+         font-size: 22px;
+         float:right;
+          }
+          p {
+            height: 44px;
+            display: flex;
+            align-items: flex-end;
+            justify-items: center;
+            font-size: 34px;
+          }
+        }
     }
  
   //position: relative;