前端

fuintAdmin_zt/src/views/financialStatement/yunyingfenxi/tab/oil.vue

@@ -65,10 +65,6 @@
             placeholder="交易结束日期">
           </el-date-picker>
         </el-form-item>
-
-
-
-
         <el-form-item class="" style="float: right;">
           <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
           <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
@@ -76,6 +72,7 @@
       </el-form>
       <!--    </el-card>-->
       <!--    <el-card class="box-card">-->
+
       <div class="table-box">
         <el-table
           :data="orderList"

fuintAdmin_zt/src/views/financialStatement/yunyingfenxi/tab/vip.vue

@@ -76,6 +76,36 @@
       </el-form>
 <!--    </el-card>-->
 <!--    <el-card class="box-card">-->
+      <div class="wrap-box">
+        <div class="k_" id="k_1">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_2">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_3">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_4">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_5">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_6">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+        <div class="k_" id="k_7">
+          <div class="size_">会员总数</div>
+          <div class="title_">335</div>
+        </div>
+      </div>
       <div class="table-box">
         <el-table
           :data="orderList"
@@ -288,5 +318,64 @@ import {
   .table-box{
     width: 100%;
   }
-
+  .wrap-box{
+    width: 100%;
+    display: flex;
+    align-items: center;
+    margin-bottom: 15px;
+  }
+  .k_{
+    width: 200px;
+    height: 80px;
+    margin-right: 20px;
+    box-sizing: border-box;
+    padding: 15px 10px;
+    color: #333333;
+  }
+  .size_{
+    font-weight: 400;
+    font-size: 14px;
+    color: #333333;
+    margin-bottom: 10px;
+  }
+  .title_{
+    font-weight: 600;
+    font-size: 24px;
+    color: #333333;
+  }
+  #k_1{
+    background: url("../imgs/k1.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_2{
+    background: url("../imgs/k2.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_3{
+    background: url("../imgs/k3.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_4{
+    background: url("../imgs/k4.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_5{
+    background: url("../imgs/k5.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_6{
+    background: url("../imgs/k6.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
+  #k_7{
+    background: url("../imgs/k7.png");
+    background-size: cover; /* 背景图片铺满盒子 */
+    background-repeat: no-repeat; /* 禁止背景图片重复 */
+  }
 </style>