pwLogin.vue 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. <template>
  2. <view class="pw-login-wrap">
  3. <!-- <view v-if="!buildType" style="text-align: center;color: #999999;padding-top: 40px;">{{ envTips }}</view> -->
  4. <view class="logo">
  5. <u-image src="/static/logo.jpg" width="140" height="140" ></u-image>
  6. </view>
  7. <form class="login-form" @submit="formSubmit">
  8. <view class="form-item">
  9. <input v-model="form.loginName" class="item-inp" name="loginName" type="text" maxlength="30" placeholder="请输入用户名" />
  10. </view>
  11. <view class="form-item">
  12. <input v-model="form.password" class="item-inp" name="password" password type="text" maxlength="12" placeholder="请输入密码" />
  13. </view>
  14. <view class="flex-box" style="margin-top: 60upx;">
  15. <view class="remember-pass">
  16. <u-checkbox v-model="isRemember" value="true" :size="30" :label-size="26" active-color="#07c160" class="login-form-checkbox" @change="rememberChange">记住密码</u-checkbox>
  17. </view>
  18. </view>
  19. <view class="form-btn-con">
  20. <button class="form-btn" form-type="submit">登录</button>
  21. </view>
  22. </form>
  23. </view>
  24. </template>
  25. <script>
  26. import market from "@/js_sdk/dc-market/market.js"
  27. import { checkVersionToLoadUpdate, setStorageForAppVersion,clzConfirm } from '@/libs/tools'
  28. import { isvalidPhone } from '@/libs/validate.js';
  29. import { login } from '@/api/user.js';
  30. import { getSysVersion } from '@/api/data.js'
  31. export default {
  32. data() {
  33. return {
  34. form: {
  35. loginName: this.$store.state.vuex_user.account,
  36. password: this.$store.state.vuex_user.password
  37. },
  38. isRemember: true, // 是否记住密码
  39. envTips: '',
  40. buildType: '',
  41. };
  42. },
  43. mounted() {
  44. this.isRemember = this.$store.state.vuex_isRemember || true;
  45. this.envTips = getApp().globalData.envTips;
  46. this.buildType = getApp().globalData.buildType;
  47. },
  48. onShow() {
  49. },
  50. methods: {
  51. // 获取微信login code
  52. getWechatCode(){
  53. const _this = this
  54. wx.login({
  55. success (res) {
  56. if (res.code) {
  57. //发起网络请求
  58. let formData = JSON.parse(JSON.stringify(_this.form))
  59. formData.code = res.code
  60. _this.submitForm(formData)
  61. } else {
  62. console.log('登录失败,点击“登录”重试!' + res.errMsg)
  63. }
  64. }
  65. })
  66. },
  67. // 表单提交
  68. formSubmit() {
  69. const _this = this;
  70. // 表单校验
  71. if (_this.form.loginName == '') {
  72. uni.showToast({ icon: 'none', title: '请输入用户名' });
  73. return;
  74. }
  75. // if (!isvalidPhone(_this.form.loginName)) {
  76. // uni.showToast({ icon: 'none', title: '请输入正确的手机号码' });
  77. // return;
  78. // }
  79. if (_this.form.password == '') {
  80. uni.showToast({ icon: 'none', title: '请输入密码' });
  81. return;
  82. }
  83. if (_this.form.password.length < 6 || _this.form.password.length > 12) {
  84. uni.showToast({ icon: 'none', title: '请输入6-12位密码' });
  85. return;
  86. }
  87. uni.showLoading({
  88. title: '正在登录...'
  89. });
  90. // #ifdef MP-WEIXIN
  91. // 获取微信login code
  92. this.getWechatCode()
  93. // #endif
  94. // #ifndef MP-WEIXIN
  95. this.submitForm(_this.form)
  96. // #endif
  97. },
  98. submitForm(formData){
  99. const _this = this;
  100. // 登录
  101. login(formData).then(res => {
  102. uni.hideLoading();
  103. if (res.status == 200) {
  104. _this.$u.vuex('vuex_token', res.data);
  105. getApp().globalData.token = res.data;
  106. //登录成功将用户名密码存储到用户本地
  107. if (_this.isRemember) {
  108. //用户勾选“记住密码”
  109. _this.$u.vuex('vuex_user.account', _this.form.loginName);
  110. _this.$u.vuex('vuex_user.password', _this.form.password);
  111. } else {
  112. //用户没有勾选“记住密码”
  113. _this.$u.vuex('vuex_user.account', '');
  114. _this.$u.vuex('vuex_user.password', '');
  115. _this.form.loginName = '';
  116. _this.form.password = '';
  117. }
  118. uni.setStorageSync('loginTimeOut', 'NO');
  119. _this.toMain();
  120. } else {
  121. uni.showToast({ icon: 'none', title: res.message });
  122. }
  123. });
  124. },
  125. toMain() {
  126. // 跳转到首页
  127. uni.switchTab({
  128. url: '/pages/index/index'
  129. });
  130. },
  131. // 忘记密码
  132. forgetPass() {
  133. uni.navigateTo({
  134. url: '/pages/login/forget-pass?username=' + this.form.loginName
  135. });
  136. },
  137. // 判断是否记住密码
  138. rememberChange(e) {
  139. this.isRemember = e.value;
  140. },
  141. toYsPage() {
  142. uni.navigateTo({
  143. url: '/pages/agreement/agreement'
  144. });
  145. }
  146. }
  147. };
  148. </script>
  149. <style scoped lang="scss">
  150. @import './login.scss';
  151. </style>