考试前界面改版和用户界面改版

src/components/m-nav-bar/m-nav-bar.vue

@@ -0,0 +1,62 @@
+<template>
+    <div class="header" >
+       <image @click="onClickLeft" class="arrow" src="https://ct.zzxcx.net/ctjk/mp-wx/beforeMockExam/arrow-left.png"></image>
+        <span class="title">{{ title }}</span>
+    </div>
+</template>
+
+<script>
+import mIcon from './../m-icon/m-icon.vue'
+export default {
+    data() {
+        return {
+
+        }
+    },
+    components: {
+        mIcon,
+    },
+    props: {
+        transparent: {
+            type: Boolean,
+            default: false
+        },
+        title: {
+            type: String,
+            default: ''
+        },
+        iconStyle: {
+            type: String,
+            default: ''
+        }
+    },
+    methods: {
+        onClickLeft() {
+           uni.navigateBack()
+        }
+    },
+
+}
+</script>
+
+<style lang="less" scoped>
+.header {
+    position: sticky;
+    top: 0;
+    font-size: 15px;
+    padding: 15px;
+    z-index: 999;
+    .arrow{
+        width: 10px;
+        height: 17px;
+    }
+
+    .title {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        color: #fff;
+    }
+}
+</style>

src/otherPages/beforeMockExam/index.vue

@@ -1,14 +1,14 @@
 <template>
-  <view>
-    <div class="header-back">
-      <m-nav-bar :transparent="true" title="模拟考试" />
-      <div class="user-data">
-        <m-user-avatar />
-        <m-user-name />
-      </div>
-    </div>
+  <view class="bg">
+    <m-nav-bar  title="模拟考试" :transparent="true" />
+    <view class="user">
+      <image class="userImage" :src="headImage"></image>
+      <view class="name">
+        {{nickName}}
+      </view>
+    </view>
     <div class="content">
-      <div class="title">考试说明</div>
+      <div class="title"></div>
       <div class="class">
         <span>考试科目</span>
         <span>{{ query.subject==1?'科目一':'科目四' }}</span>
@@ -25,6 +25,10 @@
         <span>合格标准</span>
         <span>90分及格</span>
       </div>
+      <div class="class">
+        <span>出题规则</span>
+        <span>交管局出题规则</span>
+      </div>
       <!-- #ifdef MP-WEIXIN-->
       <!-- <div class="class">
         <span>学员姓名</span>
@@ -62,9 +66,12 @@ export default {
     this.query = query;
   },
   computed: {
-    realName() {
-      return this.$store.state.user.userInfo.realName;
+    headImage() {
+      return this.$store.state.user.userInfo.headImage;
     },
+    nickName(){
+      return this.$store.state.user.userInfo.nickName;
+    }
   },
   methods: {
     goMockExam(e) {},
@@ -82,6 +89,11 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.bg{
+  width: 100%;
+  background-image: url('https://ct.zzxcx.net/ctjk/mp-wx/beforeMockExam/bg.png');
+  height: 100vh;
+}
 .header-back {
   width: 750rpx;
   padding-bottom: 82px;
@@ -118,27 +130,47 @@ export default {
   background: #e2e2e2;
   border-radius: 30rpx;
   padding-left: 16rpx;
+}
+.user{
+  padding-top: 40rpx;
+  padding-left: 60rpx;
+  height: 152rpx;
+  display: flex;
+  .userImage{
+    width: 112rpx;
+    height: 112rpx;
+  }
+  .name{
+    height: 112rpx;
+    line-height: 112rpx;
+    font-size: 30rpx;
+    padding-left: 12rpx;
+    color: #fff;
+  }
+
+
 }
 .content {
   width: 690rpx;
   background: #ffffff;
   box-shadow: 0px 0px 8rpx rgba(124, 129, 136, 0.2);
-  border-radius: 10rpx;
+  border-radius: 20rpx;
   position: relative;
   left: 50%;
-  top: -52rpx;
+  top: 80rpx;
   transform: translateX(-50%);
-  padding: 38rpx 15rpx;
+  padding: 0rpx 0rpx;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   align-items: center;
+  padding-bottom: 80rpx;
   .title {
-    font-size: 30rpx;
-    font-family: PingFang SC;
-    font-weight: 400;
-    color: #0a1a33;
-    margin-bottom: 10rpx;
+    background-image: url('https://ct.zzxcx.net/ctjk/mp-wx/beforeMockExam/header.png');
+    background-size:100%;
+    background-repeat: no-repeat;
+    width: 100%;
+    height: 116rpx;
   }
   .class {
     font-size: 26rpx;

src/pages.json

@@ -469,6 +469,11 @@
         "path": "otherPages/userInfoAuth/index",
         "name": "用户信息授权填写" 
 
+      },
+      {
+        "path": "pages/user/index",
+        "name": "用户" 
+
       },
       {
         "path":"otherPages/mockExam/index",

src/pages/user/index.vue

@@ -1,26 +1,29 @@
 <template>
-  <scroll-view scroll-y class="content">
-    <div class="user">
-      <van-cell @click="getUserProfile" center :value="userInfo.nickName ? userInfo.nickName : '新用户'">
-        <view slot="title">
-          <image class="user-headImg" v-if="userInfo.headImage" :src="userInfo.headImage"></image>
-          <image class="user-headImg" v-else :src="unLoginHead"></image>
-        </view>
-      </van-cell>
-      <van-cell title-class="uni-app-fontsize-paragraph" title="电子资料" is-link @click="goPath('/pages/extraWeb/index?src=https://nbjk-h5.zzxcx.net/pdfImages')"
-        center>
-        <template #icon>
-          <m-icon type="fkbz" class="cell-icon" />
-        </template>
-      </van-cell>
-      <!-- <van-cell title="我要提现" value="" is-link center @click="goCashOut">
+  <view>
+    <scroll-view scroll-y class="bg">
+      <div class="user">
+        <van-cell custom-class="head-cell" is-link label-class="" center>
+          <view class="flex" slot="title">
+            <image class="user-headImg" v-if="userInfo.headImage" :src="userInfo.headImage"></image>
+            <image class="user-headImg" v-else :src="unLoginHead"></image>
+            <view class="" style="width:50%;padding-left: 24rpx;">
+              <view style="font-size:38rpx;color: #0A1A33;">{{ userInfo.nickName }}</view>
+              <view style="font-size:26rpx;color: #8A9099;"> {{ '未绑定手机号' }}</view>
+
+            </view>
+
+          </view>
+        </van-cell>
+
+
+        <!-- <van-cell title="我要提现" value="" is-link center @click="goCashOut">
         </van-cell> -->
-      <!-- <van-cell title="我的下级" value="" is-link center @click="goMyBranch">
+        <!-- <van-cell title="我的下级" value="" is-link center @click="goMyBranch">
 				<template #icon>
 					<m-icon type="hyyxq" class="cell-icon" />
 				</template>
 			</van-cell> -->
-      <!-- <van-cell
+        <!-- <van-cell
           title="我的推广积分"
           value=""
           is-link
@@ -28,8 +31,8 @@
           @click="goMyIntegral"
         >
         </van-cell> -->
-      <!-- #ifdef MP-WEIXIN -->
-      <!-- <van-cell
+        <!-- #ifdef MP-WEIXIN -->
+        <!-- <van-cell
         title="会员有效期"
         :value="expireTime ? expireTime : '开通会员'"
         is-link
@@ -38,37 +41,46 @@
       >
       </van-cell> -->
 
-      <!-- #endif -->
-      <!-- #ifdef MP-TOUTIAO -->
-      <van-cell v-if="!isVip" title="会员有效期" :value="'开通会员'" is-link center url="/otherPages/buyVip/index">
-      </van-cell>
-      <van-cell v-if="isVip" title="会员有效期" :value="'已开通'" is-link center>
-      </van-cell>
-      <van-cell title="资料下载" is-link @click="goVipPath('/otherPages/pdfList/index')" center>
-        <template #icon>
-          <m-icon type="fkbz" class="cell-icon" />
-        </template>
-      </van-cell>
+        <!-- #endif -->
+        <!-- #ifdef MP-TOUTIAO -->
+        <van-cell v-if="!isVip" title="会员有效期" :value="'开通会员'" is-link center url="/otherPages/buyVip/index">
+        </van-cell>
+        <van-cell v-if="isVip" title="会员有效期" :value="'已开通'" is-link center>
+        </van-cell>
+        <van-cell title="资料下载" is-link @click="goVipPath('/otherPages/pdfList/index')" center>
+          <template #icon>
+            <m-icon type="fkbz" class="cell-icon" />
+          </template>
+        </van-cell>
 
-      <!-- #endif -->
-      <!-- #ifdef MP-WEIXIN -->
-<!-- 
+        <!-- #endif -->
+        <!-- #ifdef MP-WEIXIN -->
+        <!-- 
       <van-cell title-class="uni-app-fontsize-paragraph" title="反馈帮助" is-link center url="/pages/extraWeb/index?src=https://support.qq.com/product/359609">
         <template #icon>
           <m-icon type="fkbz" class="cell-icon" />
         </template>
       </van-cell> -->
 
-      <!-- #endif -->
-    </div>
-    <view class="wxad">
-      <ad ad-type="video" :ad-intervals="100" unit-id="adunit-8eb44bbd7e3147d4"></ad>
-    </view>
-   
-    <!-- <view class="ad-box serviceBox">
+        <!-- #endif -->
+      </div>
+      <view class="list">
+        <van-cell title-class="uni-app-fontsize-paragraph" title="电子资料" is-link
+          @click="goPath('/pages/extraWeb/index?src=https://nbjk-h5.zzxcx.net/pdfImages')" center>
+          <template #icon>
+            <m-icon type="fkbz" class="cell-icon" />
+          </template>
+        </van-cell>
+      </view>
+      <view class="wxad">
+        <ad ad-type="video" :ad-intervals="100" unit-id="adunit-8eb44bbd7e3147d4"></ad>
+      </view>
+
+      <!-- <view class="ad-box serviceBox">
 			<ad unit-id="adunit-d8c1548cc9663765"></ad>
 		</view> -->
-  </scroll-view>
+    </scroll-view>
+  </view>
 </template>
 
 <script>
@@ -100,8 +112,8 @@ export default {
     goPath(url) {
 
       uni.navigateTo({
-          url,
-        });
+        url,
+      });
     },
     goVipPath(url) {
       if (this.isVip) {
@@ -145,11 +157,34 @@ export default {
   },
 };
 </script>
-
+<style>
+.user .head-cell {
+  background: transparent;
+}
+</style>
 <style lang="scss" scoped>
+.flex {
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: row;
+}
+
+.bg {
+  width: 100%;
+  min-height: 812rpx;
+  // background: #fff;
+  background-image: url('https://ct.zzxcx.net/ctjk/mp-wx/user/bg.png');
+}
+
+.list {
+  padding: 0 15rpx;
+}
+
 .user {
-  background-color: #f2f3f5;
- 
+  padding: 0 15rpx;
+
+
+
   /* height: 100vh; */
   .group {
     margin: 10px 0;