首页样式优化

src/components/shop-list.vue

@@ -2,14 +2,16 @@
   <div class="shop_list">
     <h3 class="shop_list-title">
       <span v-text="name"></span>
-      <a @click.prevent="goto" :style="{ cursor: to ? 'pointer' : 'text' }">
-        <i class="el-icon-arrow-right"></i>
-      </a>
+      <a @click.prevent="goto" :style="{ cursor: to ? 'pointer' : 'text' }"></a>
     </h3>
 
     <ul class="shop_cards">
       <li v-for="(item, index) in data" :key="'card_' + index">
-        <shop-card :data="item" :showImg="showImg" :detail-path="detailPath"></shop-card>
+        <shop-card
+          :data="item"
+          :showImg="showImg"
+          :detail-path="detailPath"
+        ></shop-card>
       </li>
     </ul>
   </div>
@@ -20,37 +22,37 @@ import shopCard from "./shop-card";
 
 export default {
   components: {
-    shopCard
+    shopCard,
   },
   props: {
     name: {
       type: String,
-      required: true
+      required: true,
     },
     to: {
       type: String,
-      required: true
+      required: true,
     },
     detailPath: {
       type: String,
-      required: true
+      required: true,
     },
     data: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     showImg: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   methods: {
     goto() {
       if (this.to) {
         this.$router.push(this.to);
       }
-    }
-  }
+    },
+  },
 };
 </script>
 
@@ -59,26 +61,25 @@ export default {
   margin: 13px 20px;
 }
 .shop_list-title > span {
+  display: inline-block;
+  vertical-align: middle;
   font-size: 18px;
   font-weight: bold;
   color: #0d1847;
   line-height: 27px;
 }
 .shop_list-title > a {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
+  display: inline-block;
+  vertical-align: middle;
+  background-image: url("../assets/imgs/home_btn_enter.png");
   width: 28px;
   height: 28px;
-  background-color: #fff;
-  border: 1px solid #edeff6;
-  border-radius: 5px;
-  overflow: hidden;
-  margin-left: 10px;
+  background-size: 100%;
+  vertical-align: -9px;
+  margin-left: 5px;
 }
-.shop_list-title > a > i {
-  font-weight: bolder;
-  color: #1e3595;
+.shop_list-title > a:hover {
+  background-image: url("../assets/imgs/home_btn_enter_hov.png");
 }
 .shop_cards {
   display: flex;

src/pages/workbench/workPlace.vue

@@ -57,9 +57,9 @@
         <p
           style="margin-top:15px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
         >
-          <span style="cursor:pointer;" @click="$router.push('/data_analysis')">
+          <span>
             <span style="display: inline-block;vertical-align:middle;">数据分析中心</span>
-            <div class="enter_btn"></div>
+            <div class="enter_btn" @click="$router.push('/data_analysis')"></div>
           </span>
         </p>
         <div class="data_charts">
@@ -158,9 +158,9 @@
         <p
           style="margin-top:15px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
         >
-          <span style="cursor:pointer;" @click="$router.push('/data_analysis')">
+          <span>
             <span style="display: inline-block;vertical-align:middle;">数据分析中心</span>
-            <div class="enter_btn"></div>
+            <div class="enter_btn" @click="$router.push('/data_analysis')"></div>
           </span>
         </p>
         <div class="data_charts" style="width:100%;">
@@ -201,9 +201,9 @@
         <p
           style="margin-top:15px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
         >
-          <span style="cursor:pointer;" @click="$router.push('/data_analysis')">
+          <span>
             <span style="display: inline-block;vertical-align:middle;">数据分析中心</span>
-            <div class="enter_btn"></div>
+            <div class="enter_btn" @click="$router.push('/data_analysis')"></div>
           </span>
         </p>
         <div class="data_charts" style="width:100%;">
@@ -235,9 +235,9 @@
         <p
           style="margin-top:10px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
         >
-          <span style="cursor:pointer;" @click="gotofw">
+          <span>
             <span style="display: inline-block;vertical-align:middle;"> {{ now_user == 0||now_user == 4 ? "我的服务" : "服务管理" }}</span>
-            <div class="enter_btn"></div>
+            <div class="enter_btn" @click="gotofw"></div>
           </span>
         </p>
         <div class="myservice">
@@ -281,9 +281,9 @@
         <p
           style="margin-top:10px;margin-bottom:10px;font-size:18px;color: #0d1847;font-weight:600;padding-left:20px;"
         >
-          <span style="cursor:pointer;" @click="gotoyy">
+          <span>
             <span style="display: inline-block;vertical-align:middle;">{{ now_user == 0||now_user == 4 ? "我的应用" : "平台应用" }}</span>
-            <div class="enter_btn"></div>
+            <div class="enter_btn" @click="gotoyy"></div>
           </span>
         </p>
         <div class="myapp">
@@ -2316,6 +2316,7 @@ export default {
   height: 28px;
   background-size: 100%;
   vertical-align: -9px;
+  cursor: pointer;
   margin-left: 5px;
 }
 .enter_btn:hover{