25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

Verification.vue 4.5 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. <template>
  2. <view>
  3. <view class="head">
  4. <template v-if="role == 2">
  5. <view class="phones">输入手机号</view>
  6. </template>
  7. <template v-else>
  8. <image class="head-immg" src="https://qufang.oss-cn-beijing.aliyuncs.com/zkgj/xcx/login.png" mode=""></image>
  9. </template>
  10. </view>
  11. <view class="input">
  12. <view class="cwjs-cells item-flex">
  13. <view class="cwjs-item center">
  14. <input type="text" v-model="username" placeholder="请输入手机号码" maxlength="11"
  15. placeholder-style='color:#AAAAAA' />
  16. </view>
  17. </view>
  18. <view class="textbox">
  19. <view class="textbox-1" @tap="bindVerification">密码登录</view>
  20. <view class="textbox-2"></view>
  21. <view class="textbox-11"></view>
  22. </view>
  23. </view>
  24. <view class="button" @tap="bindWxBLogin">获取验证码</view>
  25. </view>
  26. </template>
  27. <script>
  28. var util = require("../../utils/util.js");
  29. var config = require("../../config");
  30. var app = getApp();
  31. export default {
  32. data() {
  33. return {
  34. username: '',
  35. role: ''
  36. };
  37. },
  38. onLoad: function(options) {
  39. this.role=options.role;
  40. },
  41. methods: {
  42. //账号密码登录
  43. bindVerification() {
  44. uni.navigateTo({
  45. url: '/pages/login/index',
  46. })
  47. },
  48. //获取验证码
  49. bindWxBLogin: function(e) {
  50. if (!(/^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.username))) {
  51. util.showNone("手机号码错误");
  52. this.username='';
  53. return false;
  54. } else {
  55. uni.request({
  56. url: config.service.sendCode + "?mobile=" + this.username,
  57. method: "GET",
  58. header: {
  59. 'content-type': 'application/json',
  60. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  61. },
  62. success: (data) => {
  63. console.log(data)
  64. // 成功地响应会话信息
  65. if (data.data.code == 10000) {
  66. util.showSuccess('发送成功');
  67. if(this.role==1){
  68. uni.navigateTo({
  69. url: '/pages/login/yinzhongmalogin?username=' + this.username +
  70. '&role=' + this.role,
  71. })
  72. }else{
  73. uni.navigateTo({
  74. url: '/pages/login/Verifythelogin?username=' + this.username +
  75. '&role=' + this.role,
  76. })
  77. }
  78. // 没有正确响应会话信息
  79. } else {
  80. util.showNone(data.data.message);
  81. return false;
  82. }
  83. },
  84. })
  85. }
  86. },
  87. }
  88. };
  89. </script>
  90. <style lang="scss">
  91. .cwjs-logo {
  92. display: block;
  93. width: 219rpx;
  94. height: 158rpx;
  95. margin: 54rpx auto 66rpx;
  96. }
  97. .cwjs-tips {
  98. font-size: 24rpx;
  99. padding: 80rpx 0;
  100. color: #8a8a8a;
  101. }
  102. .cwjs-form {
  103. position: relative;
  104. margin: 0;
  105. background-color: #fff;
  106. border-radius: 10px;
  107. padding: 20rpx 40rpx 113rpx;
  108. }
  109. .cwjs-cells {
  110. width: 569rpx;
  111. display: flex;
  112. flex-direction: row;
  113. justify-content: space-between;
  114. align-items: center;
  115. margin: 0 auto;
  116. height: 88rpx;
  117. overflow: hidden;
  118. border-bottom: 1rpx solid #BFC7D3;
  119. position: relative;
  120. }
  121. .center {
  122. flex: 1;
  123. }
  124. .cwjs-input {
  125. height: 48rpx;
  126. line-height: 48rpx;
  127. padding: 23rpx 23rpx 23rpx 78rpx;
  128. font-size: 28rpx;
  129. font-family: PingFangSC-Regular, PingFang SC;
  130. color: #000;
  131. }
  132. .images {
  133. display: block;
  134. width: 40rpx;
  135. height: 21rpx;
  136. margin-right: 30rpx;
  137. margin-top: 33.5rpx;
  138. }
  139. /* 头部 */
  140. .head {
  141. width: 750rpx;
  142. height: 500rpx;
  143. position: relative;
  144. .phones {
  145. position: absolute;
  146. top: 300rpx;
  147. left: 100rpx;
  148. color: #0A6EE9;
  149. font-size: 36rpx;
  150. font-weight: bold;
  151. }
  152. .head-immg {
  153. width: 118rpx;
  154. height: 61rpx;
  155. position: absolute;
  156. top: 300rpx;
  157. left: 100rpx;
  158. }
  159. }
  160. .logo {
  161. width: 248upx;
  162. height: 248upx;
  163. display: block;
  164. position: absolute;
  165. top: 134rpx;
  166. left: 240.5rpx;
  167. }
  168. /* 输入框 */
  169. .input {
  170. width: 100%;
  171. height: auto;
  172. padding: 0 105rpx;
  173. box-sizing: border-box;
  174. }
  175. .logo_input {
  176. width: 34rpx;
  177. height: 38rpx;
  178. position: absolute;
  179. top: 25rpx;
  180. left: 0;
  181. }
  182. /* 登录 */
  183. .button {
  184. width: 630rpx;
  185. height: 86rpx;
  186. background: #2671E2;
  187. box-shadow: 0px 2rpx 20rpx 0px rgba(38, 113, 226, 0.5);
  188. border-radius: 49rpx;
  189. text-align: center;
  190. line-height: 89rpx;
  191. color: #fff;
  192. margin: 0 auto;
  193. margin-top: 239rpx;
  194. font-size: 34rpx;
  195. }
  196. .login {
  197. text-decoration: underline;
  198. text-align: center;
  199. margin-top: 40px;
  200. color: #88909E;
  201. font-size: 28rpx;
  202. }
  203. .textbox {
  204. width: 569rpx;
  205. display: flex;
  206. margin-top: 40rpx;
  207. }
  208. .textbox-1 {
  209. width: 30%;
  210. font-size: 30rpx;
  211. color: #999999;
  212. }
  213. .textbox-11 {
  214. width: 30%;
  215. text-align: right;
  216. font-size: 30rpx;
  217. color: #999999;
  218. }
  219. .textbox-2 {
  220. width: 40%;
  221. }
  222. </style>