支付页ui更新

src/views/pay/index.vue

@@ -8,12 +8,12 @@
         <span class="pl8">服务热线：400-1797-985</span>
       </div>
     </div>
-    <el-form ref="form" :model="form" :rules="rules" label-width="100px" label-position="right">
-      <el-row :gutter="20" class="border pd20">
+    <el-form ref="form" class="border pd20" :model="form" :rules="rules" label-width="80px" label-position="right">
+      <p class="f24 pb20 f-primary bold text-left">名学金榜学生卡</p>
+      <el-row :gutter="20">
         <el-col :span="12"><el-image :src="require('../../assets/images/pay_banner.png')"/></el-col>
         <el-col :span="12">
-          <p class="f24 bold text-center">名学金榜学生卡</p>
-          <el-form-item label="价格:"><span>￥{{cardActive.price/100}}</span></el-form-item>
+          <el-form-item label="价格:"><span class="bold f-red f18">￥{{cardActive.price/100}}</span></el-form-item>
           <el-form-item label="有效期:">{{cardActive.outTime}}</el-form-item>
           <el-form-item label="入学年份:">
             <el-button @click="cardActive = card"  :type="card.greadId == cardActive.greadId ? 'primary' : ''" v-for="card in cardList">
@@ -23,7 +23,7 @@
           <el-form-item label="手机号:" prop="phoneNumber">
             <el-input v-model="form.phoneNumber"></el-input>
           </el-form-item>
-          <el-form-item label="短信验证码:" prop="captcha">
+          <el-form-item label="验证码:" prop="captcha">
             <div class="fx-row">
               <el-input class="mr30" v-model="form.captcha"></el-input>
               <el-button type="plain" @click="getCode" :disabled="disabled">{{ captchaBtnText }}</el-button>
@@ -35,8 +35,8 @@
         </el-col>
       </el-row>
     </el-form>
-    <div class="tips">
-      <p class="f20">购卡须知</p>
+    <div class="tips ">
+      <p class="f20  bold f-red">购卡须知</p>
       <p>1、您将购买的是电子卡,不同的入学年份有效期和价格不同。</p>
       <p>2、购买后系统默认激活当前的登录帐号，若忘记账号请联系客服。</p>
       <p>3、由于产品特性，本电子卡不适用“7天无理由退换货”。</p>
@@ -138,7 +138,7 @@ export default {
   border: 1px solid #e2e2e2;
 }
 >>> .el-form-item{
-  margin-bottom: 22px;
+  margin-bottom: 20px;
 }
 .tips{
   padding: 20px 0;