申请贷款资料填写样式

htmldev/loan/src/views/loan/apply/index.vue

@@ -25,7 +25,7 @@
           <span v-for="(str, index) in '手机号码：'" :key="index">{{ str }}</span>
         </label>
         <div class="value-wrap">
-          <input type="text" placeholder="请输入手机号码" v-model.trim="postData.phone" @input="funLimitLength">
+          <input type="number" placeholder="请输入手机号码" v-model.trim="postData.phone" @input="funLimitLength">
         </div>
       </li>
       <li>
@@ -35,15 +35,15 @@
         <div class="value-wrap">
           <input type="number" placeholder="请输入验证码" v-model.trim="postData.code" @input="funLimitLength">
         </div>
-        <button class="get-code" @click="funGetCode">{{[0, 60].includes(numCount) ? '获取验证码': numCount + '秒'}}</button>
+        <button class="get-code" @click="funGetCode">{{[0, 60].includes(numCount) ? '获取': numCount + '秒'}}</button>
       </li>
       <li>
         <label>
           <span v-for="(str, index) in '所在城市：'" :key="index">{{ str }}</span>
         </label>
         <div class="value-wrap" @click="showPicker = true">
-          <p class="value-address" v-show="postData.province">{{ postData.province + postData.city}}</p>
-          <p class="value-address init" v-show="!postData.province">请选择所在城市</p>
+          <p class="value-city" v-show="postData.province">{{ postData.province + postData.city}}</p>
+          <p class="value-city init" v-show="!postData.province">请选择所在城市</p>
           <img src="./image/btn_next@2x.png" alt="">
         </div>
       </li>
@@ -69,9 +69,9 @@
     <button class="submit" @click="funSubmit">提交</button>
     <p class="explain">
       <span>申请代表您同意</span>
-      <router-link :to="{path: '/privacy'}">《用户隐私协议》</router-link>
+      <router-link :to="{path: '/loan/privacy'}">《用户隐私协议》</router-link>
       <span>和</span>
-      <router-link :to="{path: '/agreement'}">《服务协议》</router-link>
+      <router-link :to="{path: '/loan/agreement'}">《服务协议》</router-link>
     </p>
     <van-popup v-model="showPicker" round position="bottom">
       <van-picker
@@ -223,10 +223,7 @@
         if (!(/^\d{4}$/.test(code))) {
           this.arrErrorList.push('请输入验证码')
         }
-        if (!province) {
-          this.arrErrorList.push('请选择所在城市')
-        }
-        if (!city) {
+        if (!province || !city) {
           this.arrErrorList.push('请选择所在城市')
         }
         if (!address) {
@@ -244,7 +241,7 @@
             forbidClick: true
           })
         }
-        this.$router.replace({ path: '/detail' })
+        this.$router.replace({ path: '/loan/detail' })
       }
     }
   }
@@ -387,7 +384,7 @@
       }
     }
 
-    .value-address {
+    .value-city {
       flex: 1;
       line-height: 22px;
       font-size: 15px;
@@ -405,16 +402,15 @@
 
     .get-code {
       @include vertical-center;
-      right: 14px;
+      right: 0;
       z-index: 1;
       display: block;
       min-width: 87px;
       padding: 6px;
-      border-radius: 4px;
-      line-height: 20px;
-      font-size: 15px;
-      color: #333;
-      background: linear-gradient(90deg, #E5C7A5 0%, #CFAA7F 100%);
+      line-height: 22px;
+      font-size: 16px;
+      font-weight: 500;
+      color: #C9A585;
     }
   }