简柏林 / thingskit-app · Commits

Commit 388fbf63306ed8c29f3e48d0c5e207aba727545b

Authored by xp.Huang
2 parents 7846a407 4b096572

Merge branch 'sqy_dev' into 'main' 

Sqy dev

See merge request huang/thingskit-app!42
Inline Side-by-side
Showing 8 changed files with 607 additions and 478 deletions
... ... @@ -26,18 +26,17 @@ export default {
26 26 </script>
27 27
28 28 <style lang="scss">
29   -/* #ifndef APP-NVUE */
30 29 @import '@/uni_modules/uview-ui/index.scss';
31 30 @import './style/iconfont.scss';
32 31 @import './style/common.scss';
33 32 page {
34 33 background-color: #f5f5f5;
  34 +}
  35 +::-webkit-scrollbar {
  36 + display: none;
  37 + width: 0 !important;
  38 + height: 0 !important;
  39 + -webkit-appearance: none;
  40 + background: transparent;
35 41 }
36   -// 隐藏滚动条
37   -::-webkit-scrollbar {
38   - width: 0;
39   - height: 0;
40   - color: transparent;
41   -}
42   -/* #endif */
43 42 </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: 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>
... ...
... ... @@ -47,8 +47,10 @@ import historyData from './tabDetail/historyData.vue';
47 47 import commondRecord from './tabDetail/CommandRecord.vue';
48 48 import { getDeviceKeys, getHistoryData } from './api/index.js';
49 49 import { formatToDate } from '@/plugins/utils.js';
  50 +import MescrollCompMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp.js";
50 51 import moment from 'moment';
51 52 export default {
  53 + mixins: [MescrollCompMixin],
52 54 components: {
53 55 fTabbar,
54 56 basicInfo,
... ...
... ... @@ -49,18 +49,19 @@
49 49 </view>
50 50
51 51 <!-- 下发命令 -->
52   - <u-modal :show="showModel" closeOnClickOverlay :showConfirmButton="false" width="350px" @close="hiddenModal">
  52 + <u-modal :show="showModel" closeOnClickOverlay :showConfirmButton="false" width="720rpx" @close="hiddenModal" @touchmove.stop.prevent="disabledScroll">
53 53 <view style="width: 100%; padding: 0 30rpx;">
54 54 <view style="text-align: center; font-weight:700;margin-bottom: 40rpx;">命令下发</view>
55 55 <view class="u-flex">
56 56 <text style="color: #333; font-size: 28rpx;font-weight:700;margin-right: 30rpx;">下发类型:</text>
57   - <u-radio-group v-model="commandType" placement="row" size="14">
  57 +
  58 + <u-radio-group v-model="commandType" placement="row">
58 59 <u-radio activeColor="#3388FF" label="OneWay" name="OneWay"></u-radio>
59 60 <view style="margin: 0 20rpx;"></view>
60 61 <u-radio activeColor="#3388FF" label="TwoWay" name="TwoWay"></u-radio>
61 62 </u-radio-group>
62 63 </view>
63   - <view style="margin-top: 28rpx;"><u--textarea placeholder="请输入命令内容" v-model="commandValue" /></view>
  64 + <view style="margin-top: 28rpx;width: 100%;"><u--textarea placeholder="请输入命令内容" v-model="commandValue" /></view>
64 65
65 66 <view class="button-group">
66 67 <view><u-button :customStyle="{ color: '#333' }" color="#e3e3e5" shape="circle" text="取消" @click="cancelCommand"></u-button></view>
... ... @@ -122,6 +123,9 @@ export default {
122 123 showModal() {
123 124 this.showModel = true;
124 125 },
  126 + disabledScroll() {
  127 + return;
  128 + },
125 129 hiddenModal() {
126 130 this.showModel = false;
127 131 },
... ... @@ -132,7 +136,7 @@ export default {
132 136 commandValue.additionalInfo = {
133 137 cmdType: 'API'
134 138 };
135   - await issueCommand(this.commandType, this.deviceDetail.tbDeviceId,commandValue);
  139 + await issueCommand(this.commandType, this.deviceDetail.tbDeviceId, commandValue);
136 140 this.hiddenModal();
137 141 } catch (e) {
138 142 uni.$u.toast('下发失败~');
... ...
... ... @@ -5,7 +5,8 @@
5 5 "pages": [{
6 6 "path": "pages/index/index",
7 7 "style": {
8   - "navigationBarTitleText": "首页"
  8 + "navigationBarTitleText": "首页",
  9 + "disableScroll": true
9 10 }
10 11 },
11 12 {
... ... @@ -146,7 +147,8 @@
146 147 "navigationBarTextStyle": "black",
147 148 "navigationBarTitleText": "云腾app",
148 149 "navigationBarBackgroundColor": "#FFFFFF",
149   - "backgroundColor": "#FFFFFF"
  150 + "backgroundColor": "#FFFFFF",
  151 + "backgroundColorTop": "#FFFFFF"
150 152 },
151 153 "tabBar": {
152 154 "color": "#ffffff",
... ...
... ... @@ -25,66 +25,66 @@
25 25 </view>
26 26 </view>
27 27 </u-sticky>
28   - <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
29   - <view class="device-list">
30   - <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)" class="list-item" v-for="item in list" :key="item.id">
31   - <view
32   - class="u-flex item"
33   - style="
34   - justify-content: flex-start;
35   - flex-direction: column;
36   - align-items: center;
37   - "
38   - >
39   - <view style="width: 450rpx; text-align: left">
40   - <text style="color: #333; font-size: 30rpx;font-weight: bold;">{{ item.name }}</text>
41   - </view>
42   - <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
43   - <view style="color: #666; font-size: 14px;display: flex;">
44   - 设备编号:
45   - <view style="margin-left:16rpx">{{ item.sn }}</view>
  28 + <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
  29 + <view class="device-list">
  30 + <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)" class="list-item" v-for="item in list" :key="item.id">
  31 + <view
  32 + class="u-flex item"
  33 + style="
  34 + justify-content: flex-start;
  35 + flex-direction: column;
  36 + align-items: center;
  37 + "
  38 + >
  39 + <view style="width: 450rpx; text-align: left">
  40 + <text style="color: #333; font-size: 30rpx;font-weight: bold;">{{ item.name }}</text>
46 41 </view>
47   - </view>
48   - <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
49   - <view style="color: #666; font-size: 14px;display: flex;">
50   - 所属组织:
51   - <view style="margin-left:16rpx">{{ item.organizationDTO.name }}</view>
  42 + <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
  43 + <view style="color: #666; font-size: 14px;display: flex;">
  44 + 设备编号:
  45 + <view style="margin-left:16rpx">{{ item.sn }}</view>
  46 + </view>
  47 + </view>
  48 + <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
  49 + <view style="color: #666; font-size: 14px;display: flex;">
  50 + 所属组织:
  51 + <view style="margin-left:16rpx">{{ item.organizationDTO.name }}</view>
  52 + </view>
52 53 </view>
53 54 </view>
54   - </view>
55   - <view class="item">
56   - <view class="u-flex" style="margin-top: -6rpx">
57   - <image
58   - style="
59   - width: 30rpx;
60   - height: 30rpx;
61   - margin-top: 5rpx;
62   - margin-right: 5rpx;
63   - "
64   - :src="item.deviceState === 'ONLINE' ? '../../static/online.png' : item.deviceState === 'INACTIVE' ? '../../static/unonline.png' : '../../static/baojing.png'"
65   - />
66   -
67   - <view>
68   - <text
  55 + <view class="item">
  56 + <view class="u-flex" style="margin-top: -6rpx">
  57 + <image
69 58 style="
70   - color: #377dff;
71   - font-size: 13px;
72   - margin-left: 5rpx;
73   - margin-top: 20rpx;
74   - "
75   - :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"
76   - >
77   - {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }}
78   - </text>
  59 + width: 30rpx;
  60 + height: 30rpx;
  61 + margin-top: 5rpx;
  62 + margin-right: 5rpx;
  63 + "
  64 + :src="item.deviceState === 'ONLINE' ? '../../static/online.png' : item.deviceState === 'INACTIVE' ? '../../static/unonline.png' : '../../static/baojing.png'"
  65 + />
  66 +
  67 + <view>
  68 + <text
  69 + style="
  70 + color: #377dff;
  71 + font-size: 13px;
  72 + margin-left: 5rpx;
  73 + margin-top: 20rpx;
  74 + "
  75 + :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"
  76 + >
  77 + {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }}
  78 + </text>
  79 + </view>
79 80 </view>
80 81 </view>
81 82 </view>
82 83 </view>
83   - </view>
84   - </mescroll-body>
  84 + </mescroll-body>
85 85 <!-- 设备筛选 -->
86   - <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20">
87   - <view class="filter">
  86 + <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">
  87 + <view class="filter" @touchmove.stop.prevent="disabledScroll">
88 88 <view class="filter-title"><text>筛选条件</text></view>
89 89 <FilterItem :filterList="deviceStatus" title="设备状态" @clickTag="currentIndex => handleClickTag(currentIndex, deviceStatus)"></FilterItem>
90 90 <FilterItem :filterList="alarmStatus" title="告警状态" @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem>
... ... @@ -116,6 +116,7 @@ export default {
116 116 auto: false //是否在初始化后,自动执行downCallback; 默认true
117 117 },
118 118 upOption: {
  119 + isBounce: false,
119 120 auto: false // 不自动加载
120 121 },
121 122 show: false,
... ... @@ -217,6 +218,9 @@ export default {
217 218 }
218 219 },
219 220 methods: {
  221 + disabledScroll() {
  222 + return;
  223 + },
220 224 /*下拉刷新的回调 */
221 225 downCallback() {
222 226 //联网加载数据
... ... @@ -379,4 +383,4 @@ export default {
379 383 }
380 384 }
381 385 }
382   -</style>
  386 +</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>
10   - </view>
11   - <view class="f__login">
12   - <view class="loginPhone">
13   - <view class="form-row u-flex">
14   - <view class="v-input"><input type="text" v-model="loginForm.username" maxlength="32" placeholder="请输入登录账号" /></view>
15   - <u-icon></u-icon>
16   - </view>
17   - <view class="form-row u-flex">
18   - <view class="v-input"><input type="text" v-model="loginForm.password" maxlength="32" placeholder="请输入登录密码" :password="!showPassword" /></view>
19   - <view class="v-password" @click="showPasswordMode">
20   - <u-icon color="#9a9a9a" width="18" height="15" :name="showPassword ? '/static/eye.png' : '/static/eye-hide.png'"></u-icon>
21   - </view>
22   - <u-icon></u-icon>
23   - </view>
24   - <button class="submit" size="default" @click="onSubmitFunc"><text class="text">登录</text></button>
25   - <view class="u-flex row-item">
26   - <view class="row-phone login-text-gray" @click="openCodeFunc">手机验证码登录</view>
27   - <view class="row-reset login-text-gray" @click="findPassrordFunc">忘记密码</view>
28   - </view>
29   - <view class="u-flex link-login">
30   - <view class="link-text login-text-gray">第三方账号登录</view>
31   - <view style="height:20rpx"></view>
32   - <button class="link-image" @tap="onWenxinAuthorization"><image class="image" src="../../static/weixin.png" mode="aspectFill"></image></button>
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   - };
57   - },
58   - onLoad() {
59   - wx.login({
60   - success: res => {
61   - if (res.code) {
62   - this.code = res.code;
63   - //这里获取openid
64   - } else {
65   - return;
66   - }
67   - }
68   - });
69   - },
70   - methods: {
71   - ...mapMutations(['setUserInfo']),
72   - ...mapActions(['updateBadgeTotal']),
73   - //微信授权登录
74   - //#ifdef MP-WEIXIN
75   - onWenxinAuthorization() {
76   - wx.getUserProfile({
77   - desc: '微信第三方授权',
78   - success: reswenxin => {
79   - console.log('res=======>', reswenxin);
80   - if (reswenxin.errMsg === 'getUserProfile:ok' && reswenxin.encryptedData) {
81   - console.log('获取code', this.code);
82   - //获取用户信息
83   - let obj = {
84   - avatarUrl: reswenxin.userInfo.avatarUrl,
85   - thirdUserId: this.openid
86   - };
87   - //判断是否需要绑定
88   - uni.$u.http
89   - .get(`/yt/third/login/${this.code}`)
90   - .then(res => {
91   - console.log('Res', res);
92   - //设置全局变量openId
93   - // getApp().globalData.openId = res.data.openid;
94   - if (res.token == '' || (res.token == null && res.refreshToken)) {
95   - //需要绑定
96   - let userInfo = {
97   - isThirdLogin: true, //用于判断是否是第三方登录并且需要绑定账号
98   - avatar: obj.avatarUrl
99   - };
100   - this.setUserInfo(userInfo);
101   - //设置全局变量openId
102   - getApp().globalData.openId = res.refreshToken;
103   - uni.reLaunch({
104   - url: '../../pages/personal/personal'
105   - });
106   - } else {
107   - // 不需要绑定,直接第三方登录使用
108   - let resObj = {
109   - refreshToken: res.refreshToken,
110   - isToken: res.token
111   - };
112   - let userInfo = {
113   - ...resObj,
114   - token: true, //token用于判断是否登录
115   - isThirdLoginAndNoDind: true //用于判断是否是第三方登录并且不需要绑定账号
116   - };
117   - if (userInfo.token) {
118   - this.setUserInfo(userInfo);
119   - }
120   - uni.showToast({
121   - title: '第三方账号登录成功~',
122   - icon: 'none'
123   - });
124   - this.saveUserInfo();
125   - this.getAlarmTotalData();
126   - uni.reLaunch({
127   - url: '../../pages/personal/personal'
128   - });
129   - }
130   - })
131   - .catch(e => {
132   - uni.$u.toast(e.data?.message);
133   - });
134   - }
135   - },
136   - fail: res => {
137   - //拒绝授权
138   - return;
139   - }
140   - });
141   - },
142   - //#endif
143   - saveUserInfo() {
144   - //储存个人信息
145   - uni.$u.http.get('/yt/user/me/info').then(res => {
146   - if (res) {
147   - this.setUserInfo(res);
148   - }
149   - });
150   - },
151   - getAlarmTotalData() {
152   - uni.$u.http.get('/yt/homepage/app').then(res => {
153   - if (res) {
154   - //异步实时更新告警徽标数
155   - this.updateBadgeTotal(res.totalAlarm.activedAlarm);
156   - }
157   - });
158   - },
159   - onSubmitFunc() {
160   - if (this.loginForm.username == '') {
161   - return uni.$u.toast('请输入登录账号~');
162   - }
163   - const passReg = /^(?=.*?[A-Z])(?=(.*[a-z]){1,})(?=(.*[\d]){1,})(?=(.*[\W]){1,})(?!.*\s).{8,}$/;
164   - if (this.loginForm.password == '') {
165   - uni.showToast({
166   - title: '请输入登录密码~',
167   - icon: 'none'
168   - });
169   - return;
170   - } else if (!passReg.test(this.loginForm.password)) {
171   - uni.showToast({
172   - title: '密码格式不正确（至少一个大写英文字母、至少一个小写英文字母、至少一位数字、至少一个特殊字符、最少八个字符）~',
173   - icon: 'none',
174   - duration: 3000
175   - });
176   - return;
177   - }
178   - uni.$u.http
179   - .post('/auth/login', this.loginForm)
180   - .then(res => {
181   - if (res) {
182   - // 储存登录信息
183   - let resObj = {
184   - refreshToken: res.refreshToken,
185   - isToken: res.token
186   - };
187   - let userInfo = {
188   - ...resObj,
189   - token: true, //token用于判断是否登录
190   - isThirdLogin: false
191   - };
192   - if (userInfo.token) {
193   - this.setUserInfo(userInfo);
194   - }
195   - uni.showToast({
196   - title: '登录成功~',
197   - icon: 'none'
198   - }).then(res => {
199   - /**
200   - * 有些时候不起作用
201   - */
202   - // uni.navigateBack({
203   - // delta: 1
204   - // });
205   - // #ifdef APP-PLUS||MP
206   - uni.reLaunch({
207   - url: '/pages/personal/personal'
208   - });
209   - // #endif
210   - });
211   - this.saveUserInfo();
212   - this.getAlarmTotalData();
213   - }
214   - })
215   - .catch(e => {
216   - uni.$u.toast(e.data?.message);
217   - });
218   - },
219   - openCodeFunc() {
220   - uni.navigateTo({
221   - url: '../other/code'
222   - });
223   - },
224   - findPassrordFunc() {
225   - uni.navigateTo({
226   - url: '../other/findPassword'
227   - });
228   - },
229   - showPasswordMode() {
230   - this.showPassword = !this.showPassword;
231   - }
232   - }
233   -};
234   -</script>
235   -
236   -<style lang="scss" scoped>
237   -@import './static/login.scss';
238   -/deep/ button {
239   - background: rgba(0, 0, 0, 0);
240   -}
241   -</style>
  1 +<template>
  2 + <view class="login-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 +
  5 + <public-module></public-module>
  6 +
  7 + <view class="u-flex login-main">
  8 + <view class="content">
  9 + <view class="hello login-text-muted">您好,</view>
  10 +
  11 + <view class="hello-welcome login-text-muted">欢迎来到ThingsKit!</view>
  12 + </view>
  13 + </view>
  14 +
  15 + <view class="f__login">
  16 + <view class="loginPhone">
  17 + <view class="form-row u-flex">
  18 + <view class="v-input"
  19 + ><input
  20 + type="text"
  21 + v-model="loginForm.username"
  22 + maxlength="32"
  23 + placeholder="请输入登录账号"
  24 + /></view>
  25 +
  26 + <u-icon></u-icon>
  27 + </view>
  28 +
  29 + <view class="form-row u-flex">
  30 + <view class="v-input"
  31 + ><input
  32 + type="text"
  33 + v-model="loginForm.password"
  34 + maxlength="32"
  35 + placeholder="请输入登录密码"
  36 + :password="!showPassword"
  37 + /></view>
  38 +
  39 + <view class="v-password" @click="showPasswordMode">
  40 + <u-icon
  41 + color="#9a9a9a"
  42 + width="18"
  43 + height="15"
  44 + :name="showPassword ? '/static/eye.png' : '/static/eye-hide.png'"
  45 + ></u-icon>
  46 + </view>
  47 +
  48 + <u-icon></u-icon>
  49 + </view>
  50 +
  51 + <button class="submit" size="default" @click="onSubmitFunc">
  52 + <text class="text">登录</text>
  53 + </button>
  54 +
  55 + <view class="u-flex row-item">
  56 + <view class="row-phone login-text-gray" @click="openCodeFunc"
  57 + >手机验证码登录</view
  58 + >
  59 +
  60 + <view class="row-reset login-text-gray" @click="findPassrordFunc"
  61 + >忘记密码</view
  62 + >
  63 + </view>
  64 +
  65 + <view class="u-flex link-login">
  66 + <view class="link-text login-text-gray">第三方账号登录</view>
  67 +
  68 + <view style="height: 20rpx"></view>
  69 +
  70 + <button class="link-image" @tap="onWenxinAuthorization">
  71 + <image
  72 + class="image"
  73 + src="../../static/weixin.png"
  74 + mode="aspectFill"
  75 + ></image>
  76 + </button>
  77 + </view>
  78 + </view>
  79 + </view>
  80 + </view>
  81 +</template>
  82 +
  83 +<script>
  84 +import { mapMutations, mapActions } from "vuex";
  85 +
  86 +import { loginApp } from "@/config/login";
  87 +
  88 +import baseUrl from "@/config/baseUrl.js";
  89 +
  90 +import WXBizDataCrypt from "@/config/WXBizDataCrypt.js";
  91 +
  92 +import { appId, appSecrect } from "@/config/constant.js";
  93 +
  94 +export default {
  95 + data() {
  96 + return {
  97 + loginForm: {
  98 + username: "",
  99 +
  100 + password: "",
  101 + },
  102 +
  103 + showPassword: false,
  104 +
  105 + code: "",
  106 +
  107 + openid: "",
  108 + };
  109 + },
  110 +
  111 + onLoad() {
  112 + wx.login({
  113 + success: (res) => {
  114 + if (res.code) {
  115 + this.code = res.code;
  116 +
  117 + //这里获取openid
  118 + } else {
  119 + return;
  120 + }
  121 + },
  122 + });
  123 + },
  124 +
  125 + methods: {
  126 + ...mapMutations(["setUserInfo"]),
  127 +
  128 + ...mapActions(["updateBadgeTotal"]),
  129 +
  130 + //微信授权登录
  131 +
  132 + //#ifdef MP-WEIXIN
  133 +
  134 + onWenxinAuthorization() {
  135 + wx.getUserProfile({
  136 + desc: "微信第三方授权",
  137 +
  138 + success: (reswenxin) => {
  139 + console.log("res=======>", reswenxin);
  140 +
  141 + if (
  142 + reswenxin.errMsg === "getUserProfile:ok" &&
  143 + reswenxin.encryptedData
  144 + ) {
  145 + console.log("获取code", this.code);
  146 +
  147 + //获取用户信息
  148 +
  149 + let obj = {
  150 + avatarUrl: reswenxin.userInfo.avatarUrl,
  151 +
  152 + thirdUserId: this.openid,
  153 + };
  154 +
  155 + //判断是否需要绑定
  156 +
  157 + uni.$u.http
  158 +
  159 + .get(`/yt/third/login/${this.code}`)
  160 +
  161 + .then((res) => {
  162 + console.log("Res", res);
  163 +
  164 + //设置全局变量openId
  165 +
  166 + // getApp().globalData.openId = res.data.openid;
  167 +
  168 + if (
  169 + res.token == "" ||
  170 + (res.token == null && res.refreshToken)
  171 + ) {
  172 + //需要绑定
  173 +
  174 + let userInfo = {
  175 + isThirdLogin: true, //用于判断是否是第三方登录并且需要绑定账号
  176 +
  177 + avatar: obj.avatarUrl,
  178 + };
  179 +
  180 + this.setUserInfo(userInfo);
  181 +
  182 + //设置全局变量openId
  183 +
  184 + getApp().globalData.openId = res.refreshToken;
  185 +
  186 + uni.reLaunch({
  187 + url: "../../pages/personal/personal",
  188 + });
  189 + } else {
  190 + // 不需要绑定,直接第三方登录使用
  191 +
  192 + let resObj = {
  193 + refreshToken: res.refreshToken,
  194 +
  195 + isToken: res.token,
  196 + };
  197 +
  198 + let userInfo = {
  199 + ...resObj,
  200 +
  201 + token: true, //token用于判断是否登录
  202 +
  203 + isThirdLoginAndNoDind: true, //用于判断是否是第三方登录并且不需要绑定账号
  204 + };
  205 +
  206 + if (userInfo.token) {
  207 + this.setUserInfo(userInfo);
  208 + }
  209 +
  210 + uni.showToast({
  211 + title: "第三方账号登录成功~",
  212 +
  213 + icon: "none",
  214 + });
  215 +
  216 + this.saveUserInfo();
  217 +
  218 + this.getAlarmTotalData();
  219 +
  220 + uni.reLaunch({
  221 + url: "../../pages/personal/personal",
  222 + });
  223 + }
  224 + })
  225 +
  226 + .catch((e) => {
  227 + uni.$u.toast(e.data?.message);
  228 + });
  229 + }
  230 + },
  231 +
  232 + fail: (res) => {
  233 + //拒绝授权
  234 +
  235 + return;
  236 + },
  237 + });
  238 + },
  239 +
  240 + //#endif
  241 +
  242 + saveUserInfo() {
  243 + //储存个人信息
  244 +
  245 + uni.$u.http.get("/yt/user/me/info").then((res) => {
  246 + if (res) {
  247 + this.setUserInfo(res);
  248 + }
  249 + });
  250 + },
  251 +
  252 + async getAlarmTotalData() {
  253 + const res = await uni.$u.http.get("/yt/homepage/app");
  254 + if (res) {
  255 + //异步实时更新告警徽标数
  256 + this.updateBadgeTotal(res.totalAlarm.activedAlarm);
  257 + }
  258 + },
  259 +
  260 + onSubmitFunc() {
  261 + if (this.loginForm.username == "") {
  262 + return uni.$u.toast("请输入登录账号~");
  263 + }
  264 + const passReg =
  265 + /^(?=.*?[A-Z])(?=(.*[a-z]){1,})(?=(.*[\d]){1,})(?=(.*[\W]){1,})(?!.*\s).{8,}$/;
  266 +
  267 + if (this.loginForm.password == "") {
  268 + uni.showToast({
  269 + title: "请输入登录密码~",
  270 +
  271 + icon: "none",
  272 + });
  273 + return;
  274 + } else if (!passReg.test(this.loginForm.password)) {
  275 + uni.showToast({
  276 + title:
  277 + "密码格式不正确（至少一个大写英文字母、至少一个小写英文字母、至少一位数字、至少一个特殊字符、最少八个字符）~",
  278 +
  279 + icon: "none",
  280 +
  281 + duration: 3000,
  282 + });
  283 +
  284 + return;
  285 + }
  286 + uni.$u.http
  287 + .post("/auth/login", this.loginForm)
  288 +
  289 + .then((res) => {
  290 + if (res) {
  291 + // 储存登录信息
  292 +
  293 + let resObj = {
  294 + refreshToken: res.refreshToken,
  295 +
  296 + isToken: res.token,
  297 + };
  298 +
  299 + let userInfo = {
  300 + ...resObj,
  301 +
  302 + token: true, //token用于判断是否登录
  303 +
  304 + isThirdLogin: false,
  305 + };
  306 +
  307 + if (userInfo.token) {
  308 + this.setUserInfo(userInfo);
  309 + }
  310 +
  311 + uni
  312 + .showToast({
  313 + title: "登录成功~",
  314 +
  315 + icon: "none",
  316 + })
  317 + .then((res) => {
  318 + /**
  319 +
  320 + * 有些时候不起作用
  321 +
  322 + */
  323 +
  324 + // uni.navigateBack({
  325 +
  326 + // delta: 1
  327 +
  328 + // });
  329 +
  330 + // #ifdef APP-PLUS||MP
  331 +
  332 + uni.reLaunch({
  333 + url: "/pages/personal/personal",
  334 + });
  335 +
  336 + // #endif
  337 + });
  338 +
  339 + this.saveUserInfo();
  340 +
  341 + this.getAlarmTotalData();
  342 + }
  343 + })
  344 +
  345 + .catch((e) => {
  346 + uni.$u.toast(e.data?.message);
  347 + });
  348 + },
  349 +
  350 + openCodeFunc() {
  351 + uni.navigateTo({
  352 + url: "../other/code",
  353 + });
  354 + },
  355 +
  356 + findPassrordFunc() {
  357 + uni.navigateTo({
  358 + url: "../other/findPassword",
  359 + });
  360 + },
  361 +
  362 + showPasswordMode() {
  363 + this.showPassword = !this.showPassword;
  364 + },
  365 + },
  366 +};
  367 +</script>
  368 +
  369 +<style lang="scss" scoped>
  370 +@import "./static/login.scss";
  371 +
  372 +/deep/ button {
  373 + background: rgba(0, 0, 0, 0);
  374 +}
  375 +</style>
... ...
... ... @@ -29,6 +29,9 @@ export const mutations = {
29 29 uni.removeStorageSync('storagePre');
30 30 // #endif
31 31 },
  32 + setBadgeInfo(state,payload){
  33 + state.badgeInfo = payload;
  34 + }
32 35 };
33 36 export const actions = {
34 37 //更新告警徽标数
... ... @@ -36,6 +39,7 @@ export const actions = {
36 39 state,
37 40 commit
38 41 }, data) {
39   - state.badgeInfo = data
  42 + commit('setBadgeInfo',data)
  43 + console.log('Change total', data,state);
40 44 }
41 45 };
... ...