Authentication.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <template>
  2. <view>
  3. <!-- <titlenav></titlenav> -->
  4. <view class="authentication">
  5. <view class="title">实名认证</view>
  6. <view class="text">
  7. 账户实名认证后不能修改,
  8. <span>请使用本人身份信息完成认证</span>
  9. </view>
  10. <view class="text1">提现金额</view>
  11. <view class="inpt"><input type="number" value="" placeholder="请输入提现金额" v-model="money" /></view>
  12. <view class="text1">身份证号</view>
  13. <view class="inpt"><input type="number" value="" placeholder="请输入" v-model="idNo" /></view>
  14. <view class="text2">
  15. 已同意并阅读,
  16. <span class="text3">支付服务相关协议</span>
  17. </view>
  18. <u-button type="primary" :disabled="!canSubmit" @click="submit">同意协议并继续</u-button>
  19. </view>
  20. </view>
  21. </template>
  22. <script>
  23. import { mapState } from 'vuex';
  24. import Titlenav from '../components/Titlenav.vue';
  25. export default {
  26. components: {
  27. Titlenav
  28. },
  29. data() {
  30. return {
  31. idNo: '',
  32. money: ''
  33. };
  34. },
  35. computed: {
  36. ...mapState(['systemInfo']),
  37. canSubmit() {
  38. if (this.idNo && this.money) {
  39. return true;
  40. } else {
  41. return false;
  42. }
  43. }
  44. },
  45. methods: {
  46. submit(){
  47. if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.idNo)) {
  48. this.toast('请输入正确身份证');
  49. return;
  50. }
  51. uni.navigateTo({
  52. url: '/pages/Walletdetails'
  53. });
  54. }
  55. }
  56. };
  57. </script>
  58. <style lang="scss" scoped>
  59. .authentication {
  60. /deep/ .uni-input-placeholder {
  61. font-size: 13px;
  62. font-weight: 400;
  63. color: #aaabad;
  64. line-height: 24px;
  65. }
  66. /deep/ .u-btn {
  67. height: 48px;
  68. font-size: 16px;
  69. text-align: center;
  70. margin: 0 23px;
  71. }
  72. margin: 10px 20px 0;
  73. .title {
  74. font-size: 24px;
  75. font-weight: bold;
  76. color: #000000;
  77. line-height: 33px;
  78. }
  79. .text {
  80. font-size: 13px;
  81. font-weight: 400;
  82. color: #c8c9cc;
  83. line-height: 22px;
  84. margin-bottom: 20px;
  85. }
  86. span {
  87. color: #000000;
  88. font-weight: bold;
  89. font-size: 13px;
  90. }
  91. .text1 {
  92. font-size: 14px;
  93. font-weight: bold;
  94. color: #000000;
  95. line-height: 20px;
  96. }
  97. .inpt {
  98. background: #f5f7fa;
  99. border-radius: 8px;
  100. padding: 12px 16px;
  101. margin: 10px 0 16px;
  102. }
  103. .text2 {
  104. font-size: 13px;
  105. font-weight: 400;
  106. color: #c8c9cc;
  107. line-height: 22px;
  108. text-align: center;
  109. margin: 30px 0 10px;
  110. }
  111. .text3 {
  112. color: #214bbe;
  113. }
  114. }
  115. </style>