login.vue 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. <template>
  2. <view class="login-wrap">
  3. <view v-if="!buildType" style="text-align: center;color: #999999;padding-top: 40px;">{{ envTips }}</view>
  4. <image src="../../static/logo.png" class="logo"></image>
  5. <form class="login-form" @submit="formSubmit">
  6. <view class="form-item">
  7. <uni-font-icons size="20" color="#999" type="icon-yonghuming"></uni-font-icons>
  8. <input v-model="form.username" class="item-inp" name="username" type="number" maxlength="11" placeholder="请输入用户名" />
  9. </view>
  10. <view class="form-item">
  11. <uni-font-icons size="20" color="#999" type="icon-mima"></uni-font-icons>
  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. <checkbox-group @change="rememberChange">
  17. <label>
  18. <checkbox value="true" :checked="isRemember" class="login-form-checkbox" />
  19. <text>记住密码</text>
  20. </label>
  21. </checkbox-group>
  22. </view>
  23. <view class="forget-pass" @click="forgetPass">忘记密码</view>
  24. </view>
  25. <view class="form-btn-con">
  26. <button class="form-btn" form-type="submit">登录</button>
  27. <!-- <text class="apply-btn" @click="applyTrial">还没有账号?马上申请试用</text> -->
  28. </view>
  29. </form>
  30. <view class="authUserYs">
  31. <checkbox-group @change="authuserChange">
  32. <label>
  33. <checkbox value="true" :checked="isAuthuserYs" class="login-form-checkbox" />
  34. 登录代表同意
  35. <text @click="toYsPage()">章鱼车管家用户协议及隐私保护政策</text>
  36. </label>
  37. </checkbox-group>
  38. </view>
  39. </view>
  40. </template>
  41. <script>
  42. import market from "@/js_sdk/dc-market/market.js"
  43. import { checkVersionToLoadUpdate, setStorageForAppVersion } from '@/libs/tools'
  44. import { isvalidPhone } from '@/libs/validate.js';
  45. import { login } from '@/api/user.js';
  46. import { getSysVersion } from '@/api/data.js'
  47. export default {
  48. data() {
  49. return {
  50. form: {
  51. username: this.$store.state.vuex_user.account,
  52. password: this.$store.state.vuex_user.password
  53. },
  54. isRemember: true, // 是否记住密码
  55. isAuthuserYs: false, // 是否同意隐私政策
  56. envTips: '',
  57. buildType: ''
  58. };
  59. },
  60. mounted() {
  61. this.isRemember = this.$store.state.vuex_isRemember;
  62. this.isAuthuserYs = this.$store.state.vuex_isUsrAuthYs;
  63. this.envTips = getApp().globalData.envTips;
  64. this.buildType = getApp().globalData.buildType;
  65. },
  66. onShow() {
  67. //#ifdef APP-PLUS
  68. uni.getSystemInfo({
  69. success:(res) => {
  70. console.log(res)
  71. //检测当前平台,如果是安卓则启动安卓更新
  72. if(res.platform=="android"){
  73. // 获取最新版本信息
  74. plus.runtime.getProperty(plus.runtime.appid,(wgtinfo)=>{
  75. getApp().globalData.version = wgtinfo
  76. this.AndroidCheckUpdate()
  77. })
  78. }
  79. }
  80. })
  81. //#endif
  82. },
  83. methods: {
  84. // 安卓版本更新
  85. AndroidCheckUpdate(){
  86. let _this = this
  87. getSysVersion().then(ret => {
  88. // console.log(JSON.stringify(ret))
  89. if(ret.status == 200){
  90. this.$store.state.vuex_versionInfo = ret.data
  91. let currTimeStamp = new Date(ret.data.publicDate).getTime();
  92. // 判断缓存时间
  93. uni.getStorage({
  94. key: 'tip_version_update_time',
  95. success: function (res) {
  96. let lastTimeStamp = res.data;
  97. //定义提醒的时间间隔,避免烦人的一直提示,一个小时:36000;一天:60*60*1000*24
  98. let tipTimeLength = 60*60*1000*3;
  99. // 强制更新
  100. if(ret.data.forceUpgrade == 1){
  101. tipTimeLength = 0
  102. }
  103. console.log(lastTimeStamp+tipTimeLength>currTimeStamp)
  104. if((lastTimeStamp+tipTimeLength) > currTimeStamp){
  105. //避免多次提醒,不要更新
  106. console.log("避免多次提醒,不要更新");
  107. }else{
  108. //重新设置时间戳
  109. setStorageForAppVersion(currTimeStamp);
  110. //进行版本型号的比对 以及下载更新请求
  111. checkVersionToLoadUpdate(ret.data,0,market);
  112. }
  113. },
  114. fail:function(res){
  115. setStorageForAppVersion(currTimeStamp);
  116. }
  117. });
  118. }
  119. })
  120. },
  121. // 过滤权限code
  122. fiterAuthCode(data) {
  123. data.permCodes = data.permCodes.filter(item => item.indexOf('_mobile') > 0);
  124. return data;
  125. },
  126. // 表单提交
  127. formSubmit() {
  128. const _this = this;
  129. // 表单校验
  130. if (_this.form.username == '') {
  131. uni.showToast({ icon: 'none', title: '请输入用户名' });
  132. return;
  133. }
  134. if (!isvalidPhone(_this.form.username)) {
  135. uni.showToast({ icon: 'none', title: '请输入正确的手机号码' });
  136. return;
  137. }
  138. if (_this.form.password == '') {
  139. uni.showToast({ icon: 'none', title: '请输入密码' });
  140. return;
  141. }
  142. if (_this.form.password.length < 6 || _this.form.password.length > 12) {
  143. uni.showToast({ icon: 'none', title: '请输入6-12位密码' });
  144. return;
  145. }
  146. if (!_this.isAuthuserYs) {
  147. uni.showToast({ icon: 'none', title: '请同意并阅读用户隐私政策' });
  148. return;
  149. }
  150. uni.showLoading({
  151. title: '正在登录...'
  152. });
  153. // 登录
  154. login(_this.form).then(ret => {
  155. uni.hideLoading();
  156. let res = ret.data ? ret.data : ret;
  157. if (res.status == 200) {
  158. _this.$u.vuex('vuex_token', 'Bearer ' + res.access_token);
  159. _this.$u.vuex('vuex_userData', _this.fiterAuthCode(res.auth_user));
  160. getApp().globalData.token = 'Bearer ' + res.access_token;
  161. //登录成功将用户名密码存储到用户本地
  162. if (_this.isRemember) {
  163. //用户勾选“记住密码”
  164. _this.$u.vuex('vuex_user.account', _this.form.username);
  165. _this.$u.vuex('vuex_user.password', _this.form.password);
  166. } else {
  167. //用户没有勾选“记住密码”
  168. _this.$u.vuex('vuex_user.account', '');
  169. _this.$u.vuex('vuex_user.password', '');
  170. _this.form.username = '';
  171. _this.form.password = '';
  172. }
  173. uni.setStorageSync('loginTimeOut', 'NO');
  174. _this.toMain();
  175. } else {
  176. uni.showToast({ icon: 'none', title: res.message });
  177. }
  178. });
  179. },
  180. toMain() {
  181. // 跳转到首页
  182. uni.switchTab({
  183. url:'/pages/index/index'
  184. })
  185. },
  186. // 申请试用
  187. applyTrial() {
  188. uni.navigateTo({
  189. url: '/pages/login/apply-trial'
  190. });
  191. },
  192. // 忘记密码
  193. forgetPass() {
  194. uni.navigateTo({
  195. url: '/pages/login/forget-pass'
  196. });
  197. },
  198. // 判断是否记住密码
  199. rememberChange(e) {
  200. this.isRemember = e.detail.value.length > 0;
  201. },
  202. // 隐私
  203. authuserChange(e) {
  204. this.isAuthuserYs = e.detail.value.length > 0;
  205. this.$u.vuex('vuex_isUsrAuthYs', this.isAuthuserYs);
  206. },
  207. toYsPage() {
  208. uni.navigateTo({
  209. url: '/pages/login/userAuthYs'
  210. });
  211. }
  212. }
  213. };
  214. </script>
  215. <style scoped lang="scss">
  216. @import './login.scss';
  217. </style>