login.vue 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. <template>
  2. <view class="login-wrap">
  3. <view class="login-head">
  4. <view v-if="showEnvTips">{{ envTips }}</view>
  5. </view>
  6. <view class="login-body">
  7. <image :src="`../../static/${theme}/logo.png`" class="logo"></image>
  8. <form class="login-form" @submit="AndroidCheckUpdate">
  9. <view class="form-item">
  10. <u-input v-model="form.username" :custom-style="{fontSize:'34upx'}" height="110" type="text" clearable placeholder="请输入用户账号" />
  11. </view>
  12. <view class="form-item">
  13. <u-input v-model="form.password" :custom-style="{fontSize:'34upx'}" height="110" type="password" :password-icon="true" maxlength="50" placeholder="请输入密码"/>
  14. </view>
  15. <view class="flex-box mt20">
  16. <view class="remember-pass">
  17. <checkbox-group @change="rememberChange">
  18. <label>
  19. <u-checkbox v-model="isRemember" label-size="13px" shape="circle">记住密码</u-checkbox>
  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" :disabled="isDisabled" :style="{'background':isDisabled?'#e5e5e5':$config('primaryColor')}" form-type="submit">登录</button>
  27. <text class="apply-btn" v-if="isIos" @click="applyTrial">没有账号?请申请注册</text>
  28. </view>
  29. </form>
  30. </view>
  31. <!-- 隐私协议 -->
  32. <view class="authUserYs">
  33. <u-checkbox-group width="45rpx" @change="authuserChange">
  34. <u-checkbox v-model="isAuthuserYs" :label-disabled="false" shape="circle">
  35. </u-checkbox>
  36. </u-checkbox-group>
  37. <view>登录代表同意</view>
  38. <view @click="toYsPage">
  39. <text>用户协议</text>及<text>隐私保护政策</text>
  40. </view>
  41. </view>
  42. </view>
  43. </template>
  44. <script>
  45. import { checkVersionToLoadUpdate, setStorageForAppVersion,clzConfirm } from '@/libs/tools'
  46. import { isvalidNumLetter } from '@/libs/validate.js';
  47. import { login } from '@/api/user.js';
  48. import { getSysVersion } from '@/api/data.js'
  49. import skJGPush from '@/libs/jgPush.js'
  50. export default {
  51. data() {
  52. return {
  53. form: {
  54. username: this.$store.state.vuex_user.account,
  55. password: this.$store.state.vuex_user.password
  56. },
  57. isRemember: true, // 是否记住密码
  58. isAuthuserYs: false, // 是否同意隐私政策
  59. envTips: '',
  60. showEnvTips: false,
  61. theme: '',
  62. isIos: false,
  63. messageInfo: null
  64. };
  65. },
  66. computed: {
  67. isDisabled() {
  68. return this.form.username == '' || this.form.password == ''
  69. }
  70. },
  71. onLoad() {
  72. const token = this.$store.state.vuex_token
  73. if(token){
  74. this.AndroidCheckUpdate(1)
  75. }
  76. this.isIos = uni.getSystemInfoSync().platform == "ios"
  77. // 点击消息
  78. uni.$on('openMessage',item =>{
  79. this.messageInfo = item
  80. this.AndroidCheckUpdate()
  81. })
  82. },
  83. onUnload() {
  84. uni.$off('openMessage')
  85. },
  86. onShow() {
  87. this.isRemember = this.$store.state.vuex_isRemember;
  88. this.envTips = getApp().globalData.envTips;
  89. this.showEnvTips = process.env.NODE_ENV == 'development';
  90. this.theme = getApp().globalData.theme;
  91. //#ifdef APP-PLUS
  92. this.isAuthuserYs = this.$store.state.vuex_isUsrAuthYs
  93. uni.getSystemInfo({
  94. success:(res) => {
  95. console.log(res)
  96. // 获取最新版本信息
  97. plus.runtime.getProperty(plus.runtime.appid,(wgtinfo)=>{
  98. wgtinfo.platform = res.platform
  99. getApp().globalData.version = wgtinfo
  100. })
  101. }
  102. })
  103. //#endif
  104. },
  105. methods: {
  106. // 申请试用
  107. applyTrial() {
  108. uni.navigateTo({
  109. url: '/pages/login/apply-trial'
  110. });
  111. },
  112. // 版本更新
  113. AndroidCheckUpdate(type){
  114. let _this = this
  115. let version = getApp().globalData.version
  116. uni.showLoading({
  117. title: '正在登录...'
  118. });
  119. getSysVersion({versionType:uni.getSystemInfoSync().platform == "ios"?'IOS':'ANDROID'}).then(ret => {
  120. if(ret.status == 200){
  121. if(ret.data){
  122. this.$store.state.vuex_versionInfo = ret.data || null
  123. checkVersionToLoadUpdate(ret.data,0,_this.formSubmit)
  124. }else{
  125. if(type){
  126. this.toMain();
  127. }else{
  128. this.formSubmit();
  129. }
  130. }
  131. }
  132. uni.hideLoading()
  133. })
  134. },
  135. // 过滤权限code
  136. fiterAuthCode(data) {
  137. data.permCodes = data.permCodes.filter(item => item.indexOf('_mobile') > 0);
  138. return data;
  139. },
  140. // 表单提交
  141. formSubmit() {
  142. const _this = this;
  143. // 表单校验
  144. if (_this.form.username == '') {
  145. uni.showToast({ icon: 'none', title: '请输入用户账号' });
  146. return;
  147. }
  148. if (!isvalidNumLetter(_this.form.username)) {
  149. uni.showToast({ icon: 'none', title: '用户账号为数字或大小写字母组成!' });
  150. return;
  151. }
  152. if (_this.form.password == '') {
  153. uni.showToast({ icon: 'none', title: '请输入密码' });
  154. return;
  155. }
  156. if (_this.form.password.length < 6 || _this.form.password.length > 50) {
  157. uni.showToast({ icon: 'none', title: '请输入6-50位密码' });
  158. return;
  159. }
  160. if (!_this.isAuthuserYs) {
  161. uni.showToast({ icon: 'none', title: '请同意并阅读用户隐私政策' });
  162. return;
  163. }
  164. // 登录
  165. login(_this.form).then(res => {
  166. uni.hideLoading();
  167. if (res.status == 200) {
  168. // console.log(_this.fiterAuthCode(res.data.auth_user))
  169. _this.$u.vuex('vuex_userData', _this.fiterAuthCode(res.data.auth_user));
  170. _this.$u.vuex('vuex_token', res.data.access_token);
  171. _this.$u.vuex('vuex_authOrgs',res.data.auth_orgs);
  172. getApp().globalData.token = res.data.access_token;
  173. console.log(res.data.auth_user)
  174. // 设置别名
  175. //#ifdef APP-PLUS
  176. skJGPush.setAlias({'alias':'user_'+ getApp().globalData.buildType +'_' + res.data.auth_user.userid ,'sequence': new Date().getTime()})
  177. //#endif
  178. //登录成功将用户名密码存储到用户本地
  179. if (_this.isRemember) {
  180. //用户勾选“记住密码”
  181. _this.$u.vuex('vuex_user.account', _this.form.username);
  182. _this.$u.vuex('vuex_user.password', _this.form.password);
  183. } else {
  184. //用户没有勾选“记住密码”
  185. _this.$u.vuex('vuex_user.account', '');
  186. _this.$u.vuex('vuex_user.password', '');
  187. _this.form.username = '';
  188. _this.form.password = '';
  189. }
  190. uni.setStorageSync('loginTimeOut', 'NO');
  191. _this.toMain();
  192. } else {
  193. uni.showToast({ icon: 'none', title: res.message });
  194. }
  195. });
  196. },
  197. toMain() {
  198. console.log(this.messageInfo)
  199. this.$store.state.vuex_tempData = this.messageInfo
  200. // 跳转到首页
  201. uni.switchTab({
  202. url: '/pages/sales/index'
  203. });
  204. },
  205. // 忘记密码
  206. forgetPass() {
  207. uni.navigateTo({
  208. url: '/pages/login/forget-pass?username=' + this.form.username
  209. });
  210. },
  211. // 判断是否记住密码
  212. rememberChange(e) {
  213. this.isRemember = e.detail.value.length > 0;
  214. },
  215. // 隐私
  216. authuserChange(e) {
  217. this.$u.vuex('vuex_isUsrAuthYs', this.isAuthuserYs);
  218. //#ifdef APP-PLUS
  219. if(!this.isAuthuserYs){
  220. plus.runtime.disagreePrivacy()
  221. }else{
  222. plus.runtime.agreePrivacy()
  223. }
  224. //#endif
  225. },
  226. toYsPage() {
  227. uni.navigateTo({
  228. url: '/pages/login/userAuthYs'
  229. });
  230. }
  231. }
  232. };
  233. </script>
  234. <style scoped lang="scss">
  235. @import './login.scss';
  236. </style>