布局微改

manifest.json

@@ -68,5 +68,11 @@
   "uniStatistics": {
     "enable": false
   },
-    "vueVersion" : "3"
+  "vueVersion": "3",
+  "h5": {
+    "router": {
+      "mode": "history",
+      "base": "./"
+    }
+  }
 }

pages/index/compontents/scheme.vue

@@ -35,7 +35,7 @@
         </view>
         <view class="centre">本月得分:{{ score }}</view>
         <view class="centre-box">20年程序员工作经验</view>
-        <view class="below">擅长联赛：法国各级联赛</view>
+        <view class="up-below">擅长联赛：法国各级联赛</view>
       </view>
       <view class="record-centre">
         <view class="up">高手简介</view>
@@ -168,15 +168,16 @@
   .page-navbar {
     display: flex;
     .nav {
-      margin-left: 32.5%;
+      margin-left: 34.6%;
     }
   }
   .record {
-    margin: 20rpx auto 0;
+    margin: 40rpx auto 0;
     height: 1000rpx;
     width: 90%;
     border: 1rpx solid #000;
     background-color: #fff;
+    border-radius: 20rpx;
     .record-up {
       height: 35%;
       width: 90%;
@@ -201,6 +202,9 @@
           align-items: baseline;
         }
       }
+      .up-below {
+        margin-top: 20rpx;
+      }
       .centre {
         padding: 12rpx 5rpx 10rpx;
         margin-top: 20rpx;
@@ -240,6 +244,7 @@
       .centre ::v-deep .u-tag {
         margin: 20rpx;
         height: 80rpx;
+        border-radius: 15rpx;
       }
       .below {
         margin-top: 200rpx;

pages/index/index.vue

@@ -17,13 +17,11 @@
         <view class="card" v-for="item in text">{{ item.txt }}</view>
       </view>
       <view class="Off-card">
-        <view class="Long-card" v-for="item in 2">1</view>
+        <view class="Long-card" v-for="item in text1">{{ item.txt }}</view>
       </view>
       <view class="scheme">
         <view style="font-weight: 700">今日方案</view>
-        <view
-          style="display: flex; width: 150rpx; justify-content: space-around"
-        >
+        <view style="display: flex; justify-content: space-around">
           <view style="font-size: 20rpx">查看更多</view>
           <u-icon name="arrow-right" size="12" color="#555555"></u-icon>
         </view>
@@ -160,6 +158,14 @@
       txt: '高玩区',
     },
   ])
+  const text1 = ref([
+    {
+      txt: '充值',
+    },
+    {
+      txt: '个人中心',
+    },
+  ])
   const src = ref({
     src: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
     text: '无头像',
@@ -219,7 +225,7 @@
     text-align: center;
   }
   .headPortrait {
-    width: 650rpx;
+    width: 85%;
     height: 250rpx;
     border-radius: 20rpx;
     margin: auto;
@@ -228,8 +234,10 @@
     border: 1rpx solid #b6b5b3;
   }
   .Off-card {
+    width: 85%;
+    margin: 0 auto;
     display: flex;
-    justify-content: space-evenly;
+    justify-content: space-between;
     margin-top: 15rpx;
   }
   .card {
@@ -249,15 +257,20 @@
     margin-top: 15rpx;
     border-radius: 15rpx;
     border: 1rpx solid #b6b5b3;
+    display: flex;
+    justify-content: center;
+    align-items: center;
   }
   .scheme {
+    width: 85%;
+    margin: auto;
     display: flex;
     justify-content: space-between;
-    margin: 35rpx;
     line-height: 40rpx;
+    margin-top: 15rpx;
   }
   .Pitch-card {
-    width: 650rpx;
+    width: 85%;
     height: 400rpx;
     border-radius: 15rpx;
     margin: 20rpx auto;
@@ -283,7 +296,7 @@
     }
   }
   .Master-card {
-    width: 650rpx;
+    width: 85%;
     margin: auto;
     .top {
       display: flex;
@@ -296,7 +309,7 @@
     }
   }
   .Master-card-buttom {
-    width: 650rpx;
+    width: 85%;
     height: 250rpx;
     margin: auto;
     border: 1rpx solid #b6b5b3;