样式优化

src/assets/less/style.less

@@ -71,4 +71,48 @@ a {
   overflow: hidden;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
+}
+
+.lineTopLeft{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: .075rem;
+  height: .075rem;
+  border: 1px solid #038094;
+  border-right: none;
+  border-bottom: none;
+}
+
+.lineTopRight{
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: .075rem;
+  height: .075rem;
+  border: 1px solid #038094;
+  border-left: none;
+  border-bottom: none;
+}
+
+.lineBottomLeft{
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: .075rem;
+  height: .075rem;
+  border: 1px solid #038094;
+  border-right: none;
+  border-top: none;
+}
+
+.lineBottomRight{
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: .075rem;
+  height: .075rem;
+  border: 1px solid #038094;
+  border-left: none;
+  border-top: none;
 }

src/components/GroupPraise.vue

@@ -7,6 +7,8 @@
           <p class="group-praise__circlePercent">
             {{ dataInfo.pending || 0 }}
           </p>
+          <div class="lineTopRight"></div>
+          <div class="lineBottomLeft"></div>
         </div>
       </div>
       <div class="group-praise__circle">
@@ -15,6 +17,8 @@
           <p class="group-praise__circlePercent">
             {{ dataInfo.handler || 0 }}
           </p>
+          <div class="lineTopRight"></div>
+          <div class="lineBottomLeft"></div>
         </div>
       </div>
       <div class="group-praise__circle">
@@ -23,6 +27,8 @@
           <p class="group-praise__circlePercent">
             {{ dataInfo.overtime || 0 }}
           </p>
+          <div class="lineTopRight"></div>
+          <div class="lineBottomLeft"></div>
         </div>
       </div>
     </div>
@@ -103,6 +109,7 @@ export default {
       justify-content: center;
       margin-top: .2rem;
       background: linear-gradient( 90deg, #032430 0%, #023645 13%, #0B4D61 38%, #105A70 61%, #023645 87%, #06252B 100%);
+      position: relative;
       .group-praise__circlePercent{
         font-size: .475rem;
       }