简柏林 / thingskit-app · Commits

Commit e76578589db4eb84cfea7b329ed9c33d39ade75b

Authored by sqy
1 parent 61739d8a

fix:[DEFECT-370]:修复徽标不正确显示

Inline Side-by-side
Showing 3 changed files with 422 additions and 444 deletions
1   -<template>
2   - <view>
3   - <view :class="[isFixed ? 'f-fixed' : '']">
4   - <!-- 二次封装tabbar -->
5   - <u-tabbar
6   - :value="tabIndex"
7   - @change="onTabbar"
8   - :fixed="false"
9   - :placeholder="false"
10   - :safeAreaInsetBottom="false"
11   - :activeColor="activeColor"
12   - :inactiveColor="inactiveColor"
13   - :border="border"
14   - >
15   - <block v-for="(item, index) in list" :key="index">
16   - <!-- 自定义icon -->
17   - <u-tabbar-item :text="item.name" :badge="item.badge" :dot="item.dot" :badgeStyle="item.badgeStyle">
18   - <view slot="active-icon"><image style="width:50rpx;height: 50rpx;" :src="item.iconFill" mode=""></image></view>
19   - <view slot="inactive-icon"><image style="width:50rpx;height: 50rpx;" :src="item.icon" mode=""></image></view>
20   - </u-tabbar-item>
21   - </block>
22   - </u-tabbar>
23   - <!-- 苹果安全距离-默认20px -->
24   - <view :style="{ paddingBottom: systemInfo.tabbarPaddingB + 'px', background: '#fff' }"></view>
25   - </view>
26   - <!-- 防止塌陷高度 -->
27   - <view v-if="isFixed && isFillHeight" :style="{ height: systemInfo.tabbarH + 'px' }"></view>
28   - </view>
29   -</template>
30   -
31   -<script>
32   -import base from '@/config/baseUrl.js';
33   -import { mapState } from 'vuex';
34   -
35   -export default {
36   - name: 'f-tabbar',
37   - props: {
38   - // 是否固定在底部
39   - isFixed: {
40   - type: Boolean,
41   - default: true
42   - },
43   - // 是否设置防止塌陷高度
44   - isFillHeight: {
45   - type: Boolean,
46   - default: true
47   - },
48   - // 选中的颜色
49   - activeColor: {
50   - type: String,
51   - default: '#377dff'
52   - },
53   - // 未选中颜色
54   - inactiveColor: {
55   - type: String,
56   - default: '#606266'
57   - },
58   - // 是否显示边框色
59   - border: {
60   - type: Boolean,
61   - default: function() {
62   - return true;
63   - }
64   - },
65   - // 右上角的角标提示信息
66   - badge: {
67   - type: [String, Number, null],
68   - default: uni.$u.props.tabbarItem.badge
69   - },
70   - // 是否显示圆点，将会覆盖badge参数
71   - dot: {
72   - type: Boolean,
73   - default: uni.$u.props.tabbarItem.dot
74   - },
75   - // 控制徽标的位置，对象或者字符串形式，可以设置top和right属性
76   - badgeStyle: {
77   - type: [Object, String],
78   - default: uni.$u.props.tabbarItem.badgeStyle
79   - }
80   - },
81   - data() {
82   - return {
83   - systemInfo: base.systemInfo,
84   - tabIndex: 0,
85   - path: '', //当前路径
86   - list: [
87   - {
88   - name: '首页',
89   - url: 'pages/index/index',
90   - icon: '../../../static/home-un.png',
91   - iconFill: '../../../static/home-yes.png'
92   - },
93   - {
94   - name: '设备',
95   - url: 'pages/device/device',
96   - icon: '../../../static/device-un.png',
97   - iconFill: '../../../static/device-yes.png'
98   - },
99   - {
100   - name: '告警',
101   - url: 'pages/alarm/alarm',
102   - icon: '../../../static/alert-un.png',
103   - iconFill: '../../../static/alert-yes.png',
104   - badge: 0
105   - },
106   - {
107   - name: '我的',
108   - url: 'pages/personal/personal',
109   - icon: '../../../static/my-un.png',
110   - iconFill: '../../../static/my-yes.png'
111   - }
112   - ],
113   - badgeTotal: {
114   - t1: 0,
115   - t2: 0,
116   - t3: 0
117   - }
118   - };
119   - },
120   - onLoad() {
121   - console.log('Onload the dofunc');
122   - },
123   - created() {
124   - this.loadData();
125   - //获取页面路径
126   - let currentPages = getCurrentPages();
127   - let page = currentPages[currentPages.length - 1];
128   - this.path = page.route;
129   - if (this.list.length > 0) {
130   - this.list?.forEach((item, index) => {
131   - if (this.path == item.url) {
132   - this.tabIndex = index;
133   - }
134   - });
135   - }
136   - },
137   - computed: {
138   - ...mapState({
139   - info: state => state.badgeInfo
140   - })
141   - },
142   - methods: {
143   - loadData() {
144   - this.list[2].badge = this.info;
145   - },
146   - onTabbar(index) {
147   - setTimeout(() => {
148   - this.loadData();
149   - }, 100);
150   - if (this.list[index].url) {
151   - if (this.path !== this.list[index].url) {
152   - uni.switchTab({
153   - url: '/' + this.list[index].url
154   - });
155   - }
156   - }
157   - }
158   - }
159   -};
160   -</script>
161   -
162   -<style lang="scss" scoped>
163   -.f-fixed {
164   - position: fixed;
165   - bottom: 0;
166   - left: 0;
167   - right: 0;
168   - z-index: 1000;
169   -}
170   -</style>
  1 +<template>
  2 + <view>
  3 + <view :class="[isFixed ? 'f-fixed' : '']">
  4 + <!-- 二次封装tabbar -->
  5 + <u-tabbar
  6 + :value="tabIndex"
  7 + @change="onTabbar"
  8 + :fixed="false"
  9 + :placeholder="false"
  10 + :safeAreaInsetBottom="false"
  11 + :activeColor="activeColor"
  12 + :inactiveColor="inactiveColor"
  13 + :border="border"
  14 + >
  15 + <block v-for="(item, index) in list" :key="index">
  16 + <!-- 自定义icon -->
  17 + <u-tabbar-item :text="item.name" :badge="item.badge" :dot="item.dot" :badgeStyle="item.badgeStyle">
  18 + <view slot="active-icon"><image style="width:50rpx;height: 50rpx;" :src="item.iconFill" mode=""></image></view>
  19 + <view slot="inactive-icon"><image style="width:50rpx;height: 50rpx;" :src="item.icon" mode=""></image></view>
  20 + </u-tabbar-item>
  21 + </block>
  22 + </u-tabbar>
  23 + <!-- 苹果安全距离-默认20px -->
  24 + <view :style="{ paddingBottom: systemInfo.tabbarPaddingB + 'px', background: '#fff' }"></view>
  25 + </view>
  26 + <!-- 防止塌陷高度 -->
  27 + <view v-if="isFixed && isFillHeight" :style="{ height: systemInfo.tabbarH + 'px' }"></view>
  28 + </view>
  29 +</template>
  30 +
  31 +<script>
  32 +import base from '@/config/baseUrl.js';
  33 +import { mapState } from 'vuex';
  34 +
  35 +export default {
  36 + name: 'f-tabbar',
  37 + props: {
  38 + // 是否固定在底部
  39 + isFixed: {
  40 + type: Boolean,
  41 + default: true
  42 + },
  43 + // 是否设置防止塌陷高度
  44 + isFillHeight: {
  45 + type: Boolean,
  46 + default: true
  47 + },
  48 + // 选中的颜色
  49 + activeColor: {
  50 + type: String,
  51 + default: '#377dff'
  52 + },
  53 + // 未选中颜色
  54 + inactiveColor: {
  55 + type: String,
  56 + default: '#606266'
  57 + },
  58 + // 是否显示边框色
  59 + border: {
  60 + type: Boolean,
  61 + default: true
  62 + },
  63 + // 右上角的角标提示信息
  64 + badge: {
  65 + type: [String, Number, null],
  66 + default: uni.$u.props.tabbarItem.badge
  67 + },
  68 + // 是否显示圆点，将会覆盖badge参数
  69 + dot: {
  70 + type: Boolean,
  71 + default: uni.$u.props.tabbarItem.dot
  72 + },
  73 + // 控制徽标的位置，对象或者字符串形式，可以设置top和right属性
  74 + badgeStyle: {
  75 + type: [Object, String],
  76 + default: uni.$u.props.tabbarItem.badgeStyle
  77 + }
  78 + },
  79 + data() {
  80 + return {
  81 + systemInfo: base.systemInfo,
  82 + tabIndex: 0,
  83 + path: '', //当前路径
  84 + list: [
  85 + {
  86 + name: '首页',
  87 + url: 'pages/index/index',
  88 + icon: '../../../static/home-un.png',
  89 + iconFill: '../../../static/home-yes.png'
  90 + },
  91 + {
  92 + name: '设备',
  93 + url: 'pages/device/device',
  94 + icon: '../../../static/device-un.png',
  95 + iconFill: '../../../static/device-yes.png'
  96 + },
  97 + {
  98 + name: '告警',
  99 + url: 'pages/alarm/alarm',
  100 + icon: '../../../static/alert-un.png',
  101 + iconFill: '../../../static/alert-yes.png',
  102 + badge: this.$store.state.badgeInfo
  103 + },
  104 + {
  105 + name: '我的',
  106 + url: 'pages/personal/personal',
  107 + icon: '../../../static/my-un.png',
  108 + iconFill: '../../../static/my-yes.png'
  109 + }
  110 + ]
  111 + };
  112 + },
  113 + created() {
  114 + //获取页面路径
  115 + let currentPages = getCurrentPages();
  116 + let page = currentPages[currentPages.length - 1];
  117 + this.path = page.route;
  118 + if (this.list.length > 0) {
  119 + this.list.forEach((item, index) => {
  120 + if (this.path == item.url) {
  121 + this.tabIndex = index;
  122 + }
  123 + });
  124 + }
  125 + },
  126 + methods: {
  127 + onTabbar(index) {
  128 + this.list[2].badge =this.$store.state.badgeInfo
  129 +
  130 + if (this.list[index].url) {
  131 + if (this.path !== this.list[index].url) {
  132 + uni.switchTab({
  133 + url: '/' + this.list[index].url
  134 + });
  135 + }
  136 + }
  137 + }
  138 + }
  139 +};
  140 +</script>
  141 +
  142 +<style lang="scss" scoped>
  143 +.f-fixed {
  144 + position: fixed;
  145 + bottom: 0;
  146 + left: 0;
  147 + right: 0;
  148 + z-index: 1000;
  149 +}
  150 +</style>
... ...
1   -<template>
2   - <view class="login-page">
3   - <!-- 公共组件-每个页面必须引入 -->
4   - <public-module></public-module>
5   - <view class="u-flex login-main">
6   - <view class="content">
7   - <view class="hello login-text-muted">您好,</view>
8   - <view class="hello-welcome login-text-muted">欢迎来到ThingsKit!</view>
9   - <view class="circleStyle"></view>
10   - </view>
11   - </view>
12   - <view class="f__login">
13   - <view class="loginPhone">
14   - <view class="form-row u-flex">
15   - <view class="v-input"><input type="text" v-model="loginForm.username" maxlength="32" placeholder="请输入登录账号" /></view>
16   - <u-icon></u-icon>
17   - </view>
18   - <view class="form-row u-flex">
19   - <view class="v-input"><input type="text" v-model="loginForm.password" maxlength="32" placeholder="请输入登录密码" :password="!showPassword" /></view>
20   - <view class="v-password" @click="showPasswordMode"><u-icon color="#9a9a9a" size="25" :name="showPassword ? 'eye-fill' : 'eye-off'"></u-icon></view>
21   - <u-icon></u-icon>
22   - </view>
23   - <button class="submit" size="default" @click="onSubmitFunc"><text class="text">登录</text></button>
24   - <view class="u-flex row-item">
25   - <view class="row-phone login-text-gray" @click="openCodeFunc">手机验证码登录</view>
26   - <view class="row-reset login-text-gray" @click="findPassrordFunc">忘记密码</view>
27   - </view>
28   - <view class="u-flex link-login">
29   - <view class="link-text login-text-gray">第三方账号登录</view>
30   - <view style="height:20rpx"></view>
31   - <view @click="onAuthorization" class="link-image"><image class="image" src="../../static/weixin.png" mode="aspectFill"></image></view>
32   - <view class="circleStyleBottom"></view>
33   - </view>
34   - </view>
35   - </view>
36   - </view>
37   -</template>
38   -
39   -<script>
40   -import { mapMutations, mapActions } from 'vuex';
41   -import { loginApp } from '@/config/login';
42   -import baseUrl from '@/config/baseUrl.js';
43   -import WXBizDataCrypt from '@/config/WXBizDataCrypt.js';
44   -import { appId, appSecrect } from '@/config/constant.js';
45   -
46   -export default {
47   - data() {
48   - return {
49   - loginForm: {
50   - username: '',
51   - password: ''
52   - },
53   - showPassword: false,
54   - code: '',
55   - openid: '',
56   - session_key: ''
57   - };
58   - },
59   - onLoad() {
60   - //#ifdef MP-WEIXIN
61   - wx.login({
62   - success: res => {
63   - if (res.code) {
64   - this.code = res.code;
65   - wx.request({
66   - url: `https://api.weixin.qq.com/sns/jscode2session?appid=${appId}&secret=${appSecrect}&js_code=${this.code}&grant_type=authorization_code`,
67   - method: 'GET',
68   - success: res => {
69   - if (res.statusCode == 200) {
70   - this.openid = res.data.openid;
71   - this.session_key = res.data.session_key;
72   - //设置全局变量openId
73   - getApp().globalData.openId = res.data.openid;
74   - }
75   - },
76   - complete: e => {
77   - if (e.data.errcode != null) {
78   - return;
79   - // return uni.$u.toast('获取用户唯一id失败');
80   - }
81   - }
82   - });
83   - } else {
84   - }
85   - }
86   - });
87   - //#endif
88   - },
89   - methods: {
90   - ...mapMutations(['setUserInfo']),
91   - ...mapActions(['updateBadgeTotal']),
92   - //微信授权登录
93   - //#ifdef MP-WEIXIN
94   - onAuthorization() {
95   - /**
96   - * 注意：通过wx.getUserProfile并不能获取用户的openid，openid是唯一识别用户的标识，
97   - * 所以最好在用户授权登录时就获取。调用wx.login()获取
98   - */
99   - wx.getUserProfile({
100   - desc: '获取用户授权信息',
101   - success: res => {
102   - if (res) {
103   - //微信官方自带解密（node.js实现）
104   - let pc = new WXBizDataCrypt(appId, this.session_key);
105   - let data = pc.decryptData(res.encryptedData, res.iv);
106   - let obj = {
107   - avatarUrl: data.avatarUrl,
108   - nickName: data.nickName,
109   - thirdUserId: this.openid
110   - };
111   - //判断是否需要绑定
112   - uni.$u.http
113   - .get(`/yt/third/login/${this.openid}`)
114   - .then(res => {
115   - if (res.token == '' || res.token == null) {
116   - //需要绑定，跳转我的页面进行绑定,显示绑定按钮
117   - uni.reLaunch({
118   - url: '../../pages/personal/personal'
119   - });
120   - let userInfo = {
121   - isThirdLogin: true //token用于判断是否登录
122   - };
123   - this.setUserInfo(userInfo);
124   - } else {
125   - // 不需要绑定
126   - // 储存登录信息
127   - let resObj = {
128   - refreshToken: res.refreshToken,
129   - isToken: res.token
130   - };
131   - let userInfo = {
132   - ...resObj,
133   - token: true //token用于判断是否登录
134   - };
135   - if (userInfo.token) {
136   - this.setUserInfo(userInfo);
137   - }
138   - uni.showToast({
139   - title: '第三方账号登录成功~',
140   - icon: 'none'
141   - });
142   - this.saveUserInfo();
143   - this.getAlarmTotalData();
144   - uni.reLaunch({
145   - url: '../../pages/personal/personal'
146   - });
147   - }
148   - })
149   - .catch(e => {
150   - uni.$u.toast(e.data?.message);
151   - });
152   - /**
153   - * 有些时候uni.navigatorBack({})没有返回到上级页面
154   - * 才使用uni.reLaunch()进行跳转
155   - */
156   - // #ifdef MP
157   - setTimeout(() => {
158   - uni.reLaunch({
159   - url: '../../pages/personal/personal?obj=' + encodeURIComponent(JSON.stringify(obj))
160   - });
161   - }, 500);
162   - // #endif
163   - }
164   - }
165   - });
166   - },
167   - //#endif
168   - saveUserInfo() {
169   - //储存个人信息
170   - uni.$u.http.get('/yt/user/me/info').then(res => {
171   - if (res) {
172   - this.setUserInfo(res);
173   - }
174   - });
175   - },
176   - getAlarmTotalData() {
177   - uni.$u.http.get('/yt/homepage/app').then(res => {
178   - if (res) {
179   - //异步实时更新告警徽标数
180   - this.updateBadgeTotal(res.totalAlarm.activedAlarm);
181   - }
182   - });
183   - },
184   - onSubmitFunc() {
185   - if (this.loginForm.username == '') {
186   - return uni.$u.toast('请输入登录账号~');
187   - }
188   - const passReg = /^(?=.*?[A-Z])(?=(.*[a-z]){1,})(?=(.*[\d]){1,})(?=(.*[\W]){1,})(?!.*\s).{8,}$/;
189   - if (this.loginForm.password == '') {
190   - uni.showToast({
191   - title: '请输入登录密码~',
192   - icon: 'none'
193   - });
194   - return;
195   - } else if (!passReg.test(this.loginForm.password)) {
196   - uni.showToast({
197   - title: '密码格式不正确（至少一个大写英文字母、至少一个小写英文字母、至少一位数字、至少一个特殊字符、最少八个字符）~',
198   - icon: 'none',
199   - duration: 3000
200   - });
201   - return;
202   - }
203   - uni.$u.http
204   - .post('/auth/login', this.loginForm)
205   - .then(res => {
206   - if (res) {
207   - // 储存登录信息
208   - let resObj = {
209   - refreshToken: res.refreshToken,
210   - isToken: res.token
211   - };
212   - let userInfo = {
213   - ...resObj,
214   - token: true, //token用于判断是否登录
215   - isThirdLogin: false
216   - };
217   - if (userInfo.token) {
218   - this.setUserInfo(userInfo);
219   - }
220   - uni.showToast({
221   - title: '登录成功~',
222   - icon: 'none'
223   - }).then(res => {
224   - /**
225   - * 有些时候不起作用
226   - */
227   - // uni.navigateBack({
228   - // delta: 1
229   - // });
230   - // #ifdef APP-PLUS||MP
231   - uni.reLaunch({
232   - url: '/pages/personal/personal'
233   - });
234   - // #endif
235   - });
236   - this.saveUserInfo();
237   - this.getAlarmTotalData();
238   - }
239   - })
240   - .catch(e => {
241   - uni.$u.toast(e.data?.message);
242   - });
243   - },
244   - saveUserInfo() {
245   - //储存个人信息
246   - uni.$u.http.get('/yt/user/me/info').then(res => {
247   - if (res) {
248   - this.setUserInfo(res);
249   - }
250   - });
251   - },
252   - openCodeFunc() {
253   - uni.navigateTo({
254   - url: '../other/code'
255   - });
256   - },
257   - findPassrordFunc() {
258   - uni.navigateTo({
259   - url: '../other/findPassword'
260   - });
261   - },
262   - showPasswordMode() {
263   - this.showPassword = !this.showPassword;
264   - }
265   - }
266   -};
267   -</script>
268   -
269   -<style lang="scss" scoped>
270   -@import './static/login.scss';
  1 +<template>
  2 + <view class="login-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view class="u-flex login-main">
  6 + <view class="content">
  7 + <view class="hello login-text-muted">您好,</view>
  8 + <view class="hello-welcome login-text-muted">欢迎来到ThingsKit!</view>
  9 + <view class="circleStyle"></view>
  10 + </view>
  11 + </view>
  12 + <view class="f__login">
  13 + <view class="loginPhone">
  14 + <view class="form-row u-flex">
  15 + <view class="v-input"><input type="text" v-model="loginForm.username" maxlength="32" placeholder="请输入登录账号" /></view>
  16 + <u-icon></u-icon>
  17 + </view>
  18 + <view class="form-row u-flex">
  19 + <view class="v-input"><input type="text" v-model="loginForm.password" maxlength="32" placeholder="请输入登录密码" :password="!showPassword" /></view>
  20 + <view class="v-password" @click="showPasswordMode"><u-icon color="#9a9a9a" size="25" :name="showPassword ? 'eye-fill' : 'eye-off'"></u-icon></view>
  21 + <u-icon></u-icon>
  22 + </view>
  23 + <button class="submit" size="default" @click="onSubmitFunc"><text class="text">登录</text></button>
  24 + <view class="u-flex row-item">
  25 + <view class="row-phone login-text-gray" @click="openCodeFunc">手机验证码登录</view>
  26 + <view class="row-reset login-text-gray" @click="findPassrordFunc">忘记密码</view>
  27 + </view>
  28 + <view class="u-flex link-login">
  29 + <view class="link-text login-text-gray">第三方账号登录</view>
  30 + <view style="height:20rpx"></view>
  31 + <view @click="onAuthorization" class="link-image"><image class="image" src="../../static/weixin.png" mode="aspectFill"></image></view>
  32 + <view class="circleStyleBottom"></view>
  33 + </view>
  34 + </view>
  35 + </view>
  36 + </view>
  37 +</template>
  38 +
  39 +<script>
  40 +import { mapMutations, mapActions } from 'vuex';
  41 +import { loginApp } from '@/config/login';
  42 +import baseUrl from '@/config/baseUrl.js';
  43 +import WXBizDataCrypt from '@/config/WXBizDataCrypt.js';
  44 +import { appId, appSecrect } from '@/config/constant.js';
  45 +
  46 +export default {
  47 + data() {
  48 + return {
  49 + loginForm: {
  50 + username: '',
  51 + password: ''
  52 + },
  53 + showPassword: false,
  54 + code: '',
  55 + openid: '',
  56 + session_key: ''
  57 + };
  58 + },
  59 + onLoad() {
  60 + //#ifdef MP-WEIXIN
  61 + wx.login({
  62 + success: res => {
  63 + if (res.code) {
  64 + this.code = res.code;
  65 + wx.request({
  66 + url: `https://api.weixin.qq.com/sns/jscode2session?appid=${appId}&secret=${appSecrect}&js_code=${this.code}&grant_type=authorization_code`,
  67 + method: 'GET',
  68 + success: res => {
  69 + if (res.statusCode == 200) {
  70 + this.openid = res.data.openid;
  71 + this.session_key = res.data.session_key;
  72 + //设置全局变量openId
  73 + getApp().globalData.openId = res.data.openid;
  74 + }
  75 + },
  76 + complete: e => {
  77 + if (e.data.errcode != null) {
  78 + return;
  79 + // return uni.$u.toast('获取用户唯一id失败');
  80 + }
  81 + }
  82 + });
  83 + } else {
  84 + }
  85 + }
  86 + });
  87 + //#endif
  88 + },
  89 + methods: {
  90 + ...mapMutations(['setUserInfo']),
  91 + ...mapActions(['updateBadgeTotal']),
  92 + //微信授权登录
  93 + //#ifdef MP-WEIXIN
  94 + onAuthorization() {
  95 + /**
  96 + * 注意：通过wx.getUserProfile并不能获取用户的openid，openid是唯一识别用户的标识，
  97 + * 所以最好在用户授权登录时就获取。调用wx.login()获取
  98 + */
  99 + wx.getUserProfile({
  100 + desc: '获取用户授权信息',
  101 + success: res => {
  102 + if (res) {
  103 + //微信官方自带解密（node.js实现）
  104 + let pc = new WXBizDataCrypt(appId, this.session_key);
  105 + let data = pc.decryptData(res.encryptedData, res.iv);
  106 + let obj = {
  107 + avatarUrl: data.avatarUrl,
  108 + nickName: data.nickName,
  109 + thirdUserId: this.openid
  110 + };
  111 + //判断是否需要绑定
  112 + uni.$u.http
  113 + .get(`/yt/third/login/${this.openid}`)
  114 + .then(res => {
  115 + if (res.token == '' || res.token == null) {
  116 + //需要绑定，跳转我的页面进行绑定,显示绑定按钮
  117 + uni.reLaunch({
  118 + url: '../../pages/personal/personal'
  119 + });
  120 + let userInfo = {
  121 + isThirdLogin: true //token用于判断是否登录
  122 + };
  123 + this.setUserInfo(userInfo);
  124 + } else {
  125 + // 不需要绑定
  126 + // 储存登录信息
  127 + let resObj = {
  128 + refreshToken: res.refreshToken,
  129 + isToken: res.token
  130 + };
  131 + let userInfo = {
  132 + ...resObj,
  133 + token: true //token用于判断是否登录
  134 + };
  135 + if (userInfo.token) {
  136 + this.setUserInfo(userInfo);
  137 + }
  138 + uni.showToast({
  139 + title: '第三方账号登录成功~',
  140 + icon: 'none'
  141 + });
  142 + this.saveUserInfo();
  143 + this.getAlarmTotalData();
  144 + uni.reLaunch({
  145 + url: '../../pages/personal/personal'
  146 + });
  147 + }
  148 + })
  149 + .catch(e => {
  150 + uni.$u.toast(e.data?.message);
  151 + });
  152 + /**
  153 + * 有些时候uni.navigatorBack({})没有返回到上级页面
  154 + * 才使用uni.reLaunch()进行跳转
  155 + */
  156 + // #ifdef MP
  157 + setTimeout(() => {
  158 + uni.reLaunch({
  159 + url: '../../pages/personal/personal?obj=' + encodeURIComponent(JSON.stringify(obj))
  160 + });
  161 + }, 500);
  162 + // #endif
  163 + }
  164 + }
  165 + });
  166 + },
  167 + //#endif
  168 + saveUserInfo() {
  169 + //储存个人信息
  170 + uni.$u.http.get('/yt/user/me/info').then(res => {
  171 + if (res) {
  172 + this.setUserInfo(res);
  173 + }
  174 + });
  175 + },
  176 + async getAlarmTotalData() {
  177 + const res = await uni.$u.http.get('/yt/homepage/app');
  178 + if (res) {
  179 + //异步实时更新告警徽标数
  180 + this.updateBadgeTotal(res.totalAlarm.activedAlarm);
  181 + }
  182 + },
  183 + onSubmitFunc() {
  184 + if (this.loginForm.username == '') {
  185 + return uni.$u.toast('请输入登录账号~');
  186 + }
  187 + const passReg = /^(?=.*?[A-Z])(?=(.*[a-z]){1,})(?=(.*[\d]){1,})(?=(.*[\W]){1,})(?!.*\s).{8,}$/;
  188 + if (this.loginForm.password == '') {
  189 + uni.showToast({
  190 + title: '请输入登录密码~',
  191 + icon: 'none'
  192 + });
  193 + return;
  194 + } else if (!passReg.test(this.loginForm.password)) {
  195 + uni.showToast({
  196 + title: '密码格式不正确（至少一个大写英文字母、至少一个小写英文字母、至少一位数字、至少一个特殊字符、最少八个字符）~',
  197 + icon: 'none',
  198 + duration: 3000
  199 + });
  200 + return;
  201 + }
  202 + uni.$u.http
  203 + .post('/auth/login', this.loginForm)
  204 + .then(res => {
  205 + if (res) {
  206 + // 储存登录信息
  207 + let resObj = {
  208 + refreshToken: res.refreshToken,
  209 + isToken: res.token
  210 + };
  211 + let userInfo = {
  212 + ...resObj,
  213 + token: true, //token用于判断是否登录
  214 + isThirdLogin: false
  215 + };
  216 + if (userInfo.token) {
  217 + this.setUserInfo(userInfo);
  218 + }
  219 + uni
  220 + .showToast({
  221 + title: '登录成功~',
  222 + icon: 'none'
  223 + })
  224 + .then(async res => {
  225 + this.saveUserInfo();
  226 + await this.getAlarmTotalData();
  227 + // #ifdef APP-PLUS||MP
  228 + uni.reLaunch({
  229 + url: '/pages/personal/personal'
  230 + });
  231 + // #endif
  232 + });
  233 + }
  234 + })
  235 + .catch(e => {
  236 + uni.$u.toast(e.data?.message);
  237 + });
  238 + },
  239 + saveUserInfo() {
  240 + //储存个人信息
  241 + uni.$u.http.get('/yt/user/me/info').then(res => {
  242 + if (res) {
  243 + this.setUserInfo(res);
  244 + }
  245 + });
  246 + },
  247 + openCodeFunc() {
  248 + uni.navigateTo({
  249 + url: '../other/code'
  250 + });
  251 + },
  252 + findPassrordFunc() {
  253 + uni.navigateTo({
  254 + url: '../other/findPassword'
  255 + });
  256 + },
  257 + showPasswordMode() {
  258 + this.showPassword = !this.showPassword;
  259 + }
  260 + }
  261 +};
  262 +</script>
  263 +
  264 +<style lang="scss" scoped>
  265 +@import './static/login.scss';
271 266 </style>
... ...
... ... @@ -26,15 +26,18 @@ export const mutations = {
26 26 // #ifndef H5
27 27 uni.removeStorageSync("userInfo");
28 28 // #endif
29   - },
  29 + },
  30 + setBadgeInfo(state,payload){
  31 + state.badgeInfo = payload;
  32 + }
30 33 };
31 34 export const actions = {
32 35 //更新告警徽标数
33 36 updateBadgeTotal({
34 37 state,
35 38 commit
36   - }, data) {
37   - state.badgeInfo = data
38   - console.log('Change total', data);
  39 + }, data) {
  40 + commit('setBadgeInfo',data)
  41 + console.log('Change total', data,state);
39 42 }
40 43 };
... ...