Skip to content

杨炀 / ztx_wx_gzt

Go to a project
Toggle navigation
Toggle navigation pinning
28052d8d by 张猛
Options

账号信息

1 parent 56a2bb4d
Inline Side-by-side
Showing 2 changed files with 334 additions and 282 deletions
myCenter/index.vue
...@@ -2,36 +2,43 @@ ...@@ -2,36 +2,43 @@
2 <view class="page"> 2 <view class="page">
3 <view class="bgbg"> 3 <view class="bgbg">
4 <view class="flex"> 4 <view class="flex">
5 <view class="imgbox"> 5 <view class="imgbox">
6 <image v-if="state.user.avatar" :src="state.user.avatar"/> 6 <image v-if="state.user.avatar" :src="state.user.avatar"/>
7 <image v-else :src="config.baseUrl_api + '/fs/static/nodata.png'"/> 7 <image v-else :src="config.baseUrl_api + '/fs/static/nodata.png'"/>
8 </view> 8 </view>
9 <text class="name">{{ state.user.userName }}</text> 9 <view class="name">
10 <view>{{ state.user?.dept?.deptName }}</view>
11 <view>{{ state.user?.userName }}</view>
12 </view>
10 </view> 13 </view>
11 </view> 14 </view>
12 <view class="rMainBox"> 15 <view class="rMainBox">
13 <uni-list :border="false" class="myList"> 16 <uni-list :border="false" class="myList">
14 <uni-list-item thumb="/static/user_icon01.png" title="单位信息" showArrow clickable @click="goPath('/myCenter/teamInfo')"> 17 <uni-list-item clickable showArrow thumb="/static/user_icon01.png" title="单位信息"
15 </uni-list-item> 18 @click="goPath('/myCenter/teamInfo')">
16 19 </uni-list-item>
17 <uni-list-item thumb="/static/user_icon02.png" title="会员认证" showArrow clickable @click="goPath('/myCenter/auth')"> 20
18 </uni-list-item> 21 <uni-list-item clickable showArrow thumb="/static/user_icon02.png" title="会员认证"
19 22 @click="goPath('/myCenter/auth')">
20 <!-- <uni-list-item thumb="/static/user_icon03.png" v-show="userType==2" title="账户信息" showArrow clickable> 23 </uni-list-item>
21 </uni-list-item> --> 24
22 25 <!-- <uni-list-item thumb="/static/user_icon03.png" v-show="userType==2" title="账户信息" showArrow clickable>
23 <uni-list-item thumb="/static/user_icon03.png" title="账号安全" showArrow clickable @click="goPath('/myCenter/safe')"> 26 </uni-list-item> -->
24 </uni-list-item> 27
25 <uni-list-item thumb="/static/user_icon04.png" v-if="userType==2 || userType==6" title="我的订单" showArrow clickable @click="goPath('/myCenter/order')"> 28 <uni-list-item clickable showArrow thumb="/static/user_icon03.png" title="账号安全"
26 </uni-list-item> 29 @click="goPath('/myCenter/safe')">
27 30 </uni-list-item>
28 </uni-list> 31 <uni-list-item v-if="userType==2 || userType==6" clickable showArrow thumb="/static/user_icon04.png"
29 32 title="我的订单" @click="goPath('/myCenter/order')">
30 </view> 33 </uni-list-item>
31 34
32 <view class="fixedBottom" style="background: transparent;box-shadow: none;"> 35 </uni-list>
33 <button @click="loginOut" class="btn btn-red" style="border-radius: 50px;">退出登录</button> 36
34 </view> 37 </view>
38
39 <view class="fixedBottom" style="background: transparent;box-shadow: none;">
40 <button class="btn btn-red" style="border-radius: 50px;" @click="loginOut">退出登录</button>
41 </view>
35 </view> 42 </view>
36 </template> 43 </template>
37 44
...@@ -46,7 +53,7 @@ import { ...@@ -46,7 +53,7 @@ import {
46 onPullDownRefresh 53 onPullDownRefresh
47 } from '@dcloudio/uni-app'; 54 } from '@dcloudio/uni-app';
48 import { 55 import {
49 ref,reactive, 56 ref, reactive,
50 getCurrentInstance 57 getCurrentInstance
51 } from 'vue'; 58 } from 'vue';
52 59
...@@ -83,7 +90,7 @@ onLoad(option => { ...@@ -83,7 +90,7 @@ onLoad(option => {
83 } else { 90 } else {
84 proId = option.proId; 91 proId = option.proId;
85 } 92 }
86 if(uni.showShareMenu){ 93 if (uni.showShareMenu) {
87 uni.showShareMenu({ 94 uni.showShareMenu({
88 withShareTicket: true, 95 withShareTicket: true,
89 menus: ['shareAppMessage', 'shareTimeline'] 96 menus: ['shareAppMessage', 'shareTimeline']
...@@ -94,7 +101,7 @@ onLoad(option => { ...@@ -94,7 +101,7 @@ onLoad(option => {
94 function loginOut() { 101 function loginOut() {
95 uni.showModal({ 102 uni.showModal({
96 content: `确认退出吗？`, 103 content: `确认退出吗？`,
97 success: function(res) { 104 success: function (res) {
98 if (res.confirm) { 105 if (res.confirm) {
99 loginServer.logout().finally(() => { 106 loginServer.logout().finally(() => {
100 let path = '/login/login'; 107 let path = '/login/login';
...@@ -106,17 +113,19 @@ function loginOut() { ...@@ -106,17 +113,19 @@ function loginOut() {
106 } 113 }
107 }) 114 })
108 } 115 }
116
109 function getUser() { 117 function getUser() {
110 api.getUserProfile().then((response) => { 118 api.getUserProfile().then((response) => {
111 state.user = response.data.user 119 state.user = response.data.user
112 if(state.user.avatar&&state.user.avatar.indexOf('http')==-1){ 120 if (state.user.avatar && state.user.avatar.indexOf('http') == -1) {
113 state.user.avatar = config.baseUrl_api+state.user.avatar 121 state.user.avatar = config.baseUrl_api + state.user.avatar
114 } 122 }
115 state.roleGroup = response.data.roleGroup 123 state.roleGroup = response.data.roleGroup
116 state.postGroup = response.data.postGroup 124 state.postGroup = response.data.postGroup
117 uni.hideLoading(); 125 uni.hideLoading();
118 }) 126 })
119 } 127 }
128
120 function init() { 129 function init() {
121 uni.showLoading({ 130 uni.showLoading({
122 title: '加载中' 131 title: '加载中'
...@@ -125,108 +134,134 @@ function init() { ...@@ -125,108 +134,134 @@ function init() {
125 loginServer.getMyOwnMemberInfo().then(res => { 134 loginServer.getMyOwnMemberInfo().then(res => {
126 userType.value = app.globalData.userType 135 userType.value = app.globalData.userType
127 memberInfo.value = app.globalData.memberInfo 136 memberInfo.value = app.globalData.memberInfo
128 deptInfo.value = app.globalData.dept || {} 137 deptInfo.value = app.globalData.dept || {}
129 uni.hideLoading(); 138 uni.hideLoading();
130 }) 139 })
131 } 140 }
132 function goPath(url){ 141
133 uni.navigateTo({ 142 function goPath(url) {
134 url:url 143 uni.navigateTo({
135 }) 144 url: url
145 })
136 } 146 }
137 147
138 </script> 148 </script>
139 <style scope lang="scss">
140 .uni-list:after{display: none;}
141 .page {
142 width: 100vw;
143 overflow: hidden;
144 }
145 .bgbg{
146 .flex{align-items: center;}
147 height: 280rpx;padding:30rpx;
148 .name{margin-left: 20rpx;
149 font-size: 36rpx;}
150 .imgbox{width: 120rpx;
151 height: 120rpx;overflow: hidden;
152 // background: #C7C7CD;
153 // border: 4rpx solid #FFFFFF;
154 border-radius: 50%;
155 image{height: 120rpx;width: 120rpx;object-fit: cover;}
156 }
157 }
158 .loginOutIcon {
159 position: relative;
160 left: 60rpx;
161 // top: 180rpx;
162
163 image {
164 width: 50rpx;
165 height: 50rpx;
166 }
167 }
168
169 .flexbox {
170 display: flex;
171 justify-content: space-around;
172 text-align: center;
173
174 image {
175 width: 90rpx;
176 height: 90rpx;
177 display: block;
178 margin: auto;
179 }
180 }
181
182 .image {
183 width: 25px;
184 height: 25px;
185 }
186
187 :deep(.uni-section) {
188 background-color: transparent;
189 }
190
191 :deep(.uni-section .uni-section-header__content) {
192 font-size: 44rpx;
193 font-weight: bold;
194 color: #29343C;
195 }
196
197 :deep(.uni-section .uni-section-header) {
198 padding: 0 30rpx;
199 }
200
201 .potag {
202 position: absolute;
203 right: 60rpx;
204 top: 0;
205 }
206
207 .girdFather {
208 background: #fff;
209 position: relative;
210 top: -15rpx;
211 padding: 1rpx 0 0;
212 border-radius: 20rpx 20rpx 0rpx 0rpx;
213 box-sizing: border-box;
214
215 .girdBox {
216 top: 0;
217 padding: 0 0 15rpx;
218 border-bottom: 20rpx solid #ecf0f6
219 }
220
221 .ttt {
222 margin: 30rpx 0 20rpx;
223 padding: 0 20rpx 0;
224 }
225 }
226 .rMainBox {position: relative;top:-120rpx;
227 box-sizing: border-box;padding: 20rpx 20rpx;
228 background-color: #fff;
229 border-radius: 15rpx;
230 margin: 25rpx;overflow: hidden;
231 }
232 </style>
...\ No newline at end of file ...\ No newline at end of file
149 <style lang="scss" scope>
150 .uni-list:after {
151 display: none;
152 }
153
154 .page {
155 width: 100vw;
156 overflow: hidden;
157 }
158
159 .bgbg {
160 .flex {
161 align-items: center;
162 }
163
164 height: 280rpx;
165 padding: 30rpx;
166
167 .name {
168 margin-left: 20rpx;
169 font-size: 36rpx;
170 }
171
172 .imgbox {
173 width: 120rpx;
174 height: 120rpx;
175 overflow: hidden;
176 // background: #C7C7CD;
177 // border: 4rpx solid #FFFFFF;
178 border-radius: 50%;
179
180 image {
181 height: 120rpx;
182 width: 120rpx;
183 object-fit: cover;
184 }
185 }
186 }
187
188 .loginOutIcon {
189 position: relative;
190 left: 60rpx;
191 // top: 180rpx;
192
193 image {
194 width: 50rpx;
195 height: 50rpx;
196 }
197 }
198
199 .flexbox {
200 display: flex;
201 justify-content: space-around;
202 text-align: center;
203
204 image {
205 width: 90rpx;
206 height: 90rpx;
207 display: block;
208 margin: auto;
209 }
210 }
211
212 .image {
213 width: 25px;
214 height: 25px;
215 }
216
217 :deep(.uni-section) {
218 background-color: transparent;
219 }
220
221 :deep(.uni-section .uni-section-header__content) {
222 font-size: 44rpx;
223 font-weight: bold;
224 color: #29343C;
225 }
226
227 :deep(.uni-section .uni-section-header) {
228 padding: 0 30rpx;
229 }
230
231 .potag {
232 position: absolute;
233 right: 60rpx;
234 top: 0;
235 }
236
237 .girdFather {
238 background: #fff;
239 position: relative;
240 top: -15rpx;
241 padding: 1rpx 0 0;
242 border-radius: 20rpx 20rpx 0rpx 0rpx;
243 box-sizing: border-box;
244
245 .girdBox {
246 top: 0;
247 padding: 0 0 15rpx;
248 border-bottom: 20rpx solid #ecf0f6
249 }
250
251 .ttt {
252 margin: 30rpx 0 20rpx;
253 padding: 0 20rpx 0;
254 }
255 }
256
257 .rMainBox {
258 position: relative;
259 top: -120rpx;
260 box-sizing: border-box;
261 padding: 20rpx 20rpx;
262 background-color: #fff;
263 border-radius: 15rpx;
264 margin: 25rpx;
265 overflow: hidden;
266 }
267 </style>
......
myCenter/safe.vue
1 <template> 1 <template>
2 <view> 2 <view>
3 <uni-segmented-control :current="current" @clickItem="changeNav" activeColor="#AD181F" styleType="text" :values="items"></uni-segmented-control> 3 <uni-segmented-control
4 4 :current="current"
5 <view v-if="current==0" class="mainbox"> 5 :values="items"
6 <uni-forms label-width="80"> 6 activeColor="#AD181F"
7 <uni-forms-item label="用户昵称" required> 7 styleType="text"
8 <uni-easyinput v-model="user.nickName" :disabled="!edit" /> 8 @clickItem="changeNav"/>
9 </uni-forms-item> 9
10 <uni-forms-item label="手机号码" required> 10 <view v-if="current==0" class="mainbox">
11 <uni-easyinput v-model="user.phonenumber" :disabled="!edit" /> 11 <uni-forms label-width="80">
12 </uni-forms-item> 12 <uni-forms-item label="昵称" required>
13 <uni-forms-item label="邮箱" required> 13 <uni-easyinput v-model="user.nickName" :disabled="!edit"/>
14 <uni-easyinput v-model="user.email" :disabled="!edit" /> 14 </uni-forms-item>
15 </uni-forms-item> 15 <uni-forms-item label="手机号码" required>
16 <uni-forms-item label="性别" required> 16 <uni-easyinput v-model="user.phonenumber" :disabled="!edit"/>
17 <uni-data-checkbox :disabled="!edit" v-model="user.sex" @change="changeSex" :localdata="sexs" /> 17 </uni-forms-item>
18 </uni-forms-item> 18 <uni-forms-item label="邮箱" required>
19 </uni-forms> 19 <uni-easyinput v-model="user.email" :disabled="!edit"/>
20 20 </uni-forms-item>
21 21 <uni-forms-item label="性别" required>
22 <view class="fixedBottom" v-if="edit"> 22 <uni-data-checkbox v-model="user.sex" :disabled="!edit" :localdata="sexs" @change="changeSex"/>
23 <button class="btn-red-kx" @click="cancel">取消</button> 23 </uni-forms-item>
24 <button class="btn-red" style="width: 50%;" @click="submit">保存</button> 24 </uni-forms>
25 </view> 25
26 <view class="fixedBottom" v-else> 26
27 <button class="btn-red" @click="editForm">编辑</button> 27 <view v-if="edit" class="fixedBottom">
28 </view> 28 <button class="btn-red-kx" @click="cancel">取消</button>
29 </view> 29 <button class="btn-red" style="width: 50%;" @click="submit">保存</button>
30 <view v-if="current==1" class="mainbox"> 30 </view>
31 <uni-forms label-width="80"> 31 <view v-else class="fixedBottom">
32 <uni-forms-item label="旧密码" name="oldPassword" required> 32 <button class="btn-red" @click="editForm">编辑</button>
33 <uni-easyinput type="password" v-model="form.oldPassword" placeholder="请输入旧密码" /> 33 </view>
34 </uni-forms-item> 34 </view>
35 <uni-forms-item label="新密码" name="newPassword" required> 35 <view v-if="current==1" class="mainbox">
36 <uni-easyinput type="password" v-model="form.newPassword" placeholder="请输入新密码" /> 36 <uni-forms label-width="80">
37 <view class="text-danger" v-show="form.newPassword?.length<8">不足8位</view> 37 <uni-forms-item label="旧密码" name="oldPassword" required>
38 <text class="text-warning">*注： 8~18位大小写字母加数字加特殊符号组合(!@#$%^&*()_+)</text> 38 <uni-easyinput v-model="form.oldPassword" placeholder="请输入旧密码" type="password"/>
39 </uni-forms-item> 39 </uni-forms-item>
40 <uni-forms-item label="确认密码" name="confirmPassword" required> 40 <uni-forms-item label="新密码" name="newPassword" required>
41 <uni-easyinput type="password" v-model="form.confirmPassword" placeholder="请确认新密码" /> 41 <uni-easyinput v-model="form.newPassword" placeholder="请输入新密码" type="password"/>
42 <text class="text-danger" v-show="form.newPassword!==form.confirmPassword">与新密码不一致</text> 42 <view v-show="form.newPassword?.length<8" class="text-danger">不足8位</view>
43 </uni-forms-item> 43 <text class="text-warning">*注： 8~18位大小写字母加数字加特殊符号组合(!@#$%^&*()_+)</text>
44 44 </uni-forms-item>
45 </uni-forms> 45 <uni-forms-item label="确认密码" name="confirmPassword" required>
46 46 <uni-easyinput v-model="form.confirmPassword" placeholder="请确认新密码" type="password"/>
47 <view class="fixedBottom"> 47 <text v-show="form.newPassword!==form.confirmPassword" class="text-danger">与新密码不一致</text>
48 <button class="btn-red" @click="handleClick">修改密码</button> 48 </uni-forms-item>
49 </view> 49
50 </view> 50 </uni-forms>
51 </view> 51
52 <view class="fixedBottom">
53 <button class="btn-red" @click="handleClick">修改密码</button>
54 </view>
55 </view>
56 </view>
52 </template> 57 </template>
53 58
54 <script setup> 59 <script setup>
55 import { ref } from 'vue' 60 import {ref} from 'vue'
56 import { onLoad } from '@dcloudio/uni-app' 61 import {onLoad} from '@dcloudio/uni-app'
57 import * as api from '@/common/api.js'; 62 import * as api from '@/common/api.js';
58 const items = ref(['基本资料','修改密码']) 63
64 const items = ref(['账号信息', '修改密码'])
59 const user = ref({ 65 const user = ref({
60 sex:'0' 66 sex: '0'
61 }) 67 })
62 const current = ref(0) 68 const current = ref(0)
63 const form = ref({}) 69 const form = ref({})
64 const edit = ref(false) 70 const edit = ref(false)
65 const sexs = ref([ 71 const sexs = ref([
66 {text:'男',value: '0'},{text:'女',value: '1'} 72 {text: '男', value: '0'}, {text: '女', value: '1'}
67 ]) 73 ])
68 onLoad((option)=>{ 74 onLoad((option) => {
69 if(option.current){ 75 if (option.current) {
70 current.value = 1 76 current.value = 1
71 } 77 }
72 getUser() 78 getUser()
73 }) 79 })
74 function changeNav(e){ 80
75 if (current.value != e.currentIndex) { 81 function changeNav(e) {
76 current.value = e.currentIndex 82 if (current.value != e.currentIndex) {
77 } 83 current.value = e.currentIndex
84 }
78 } 85 }
86
79 function getUser() { 87 function getUser() {
80 api.getUserProfile().then((response) => { 88 api.getUserProfile().then((response) => {
81 user.value = response.data.user 89 user.value = response.data.user
82 if(!user.value.sex){ 90 if (!user.value.sex) {
83 user.value.sex = '0' 91 user.value.sex = '0'
84 } 92 }
85 }) 93 })
86 } 94 }
87 function editForm(){ 95
88 edit.value = true 96 function editForm() {
97 edit.value = true
89 } 98 }
90 function submit(){ 99
91 if(!user.value.email){ 100 function submit() {
92 uni.showToast({ 101 if (!user.value.email) {
93 icon:'none', 102 uni.showToast({
94 title:`请输入邮箱` 103 icon: 'none',
95 }) 104 title: `请输入邮箱`
96 return 105 })
97 } 106 return
98 if(!user.value.nickName){ 107 }
99 uni.showToast({ 108 if (!user.value.nickName) {
100 icon:'none',title:`请输入昵称` 109 uni.showToast({
101 }) 110 icon: 'none', title: `请输入昵称`
102 return 111 })
103 } 112 return
104 if(!user.value.phonenumber){ 113 }
105 uni.showToast({ 114 if (!user.value.phonenumber) {
106 icon:'none',title:`请输入手机号码` 115 uni.showToast({
107 }) 116 icon: 'none', title: `请输入手机号码`
108 return 117 })
109 } 118 return
110 if(!user.value.sex){ 119 }
111 uni.showToast({ 120 if (!user.value.sex) {
112 icon:'none',title:`请选择性别` 121 uni.showToast({
113 }) 122 icon: 'none', title: `请选择性别`
114 return 123 })
115 } 124 return
116 api.updateUserProfile(user.value).then(res=>{ 125 }
117 uni.showToast({ 126 api.updateUserProfile(user.value).then(res => {
118 icon:'none',title:`修改成功` 127 uni.showToast({
119 }) 128 icon: 'none', title: `修改成功`
120 edit.value = false 129 })
121 }) 130 edit.value = false
131 })
122 } 132 }
123 function changeSex(e){ 133
124 console.log(e) 134 function changeSex(e) {
135 console.log(e)
125 } 136 }
126 function cancel(){ 137
127 edit.value = false 138 function cancel() {
128 getUser() 139 edit.value = false
140 getUser()
129 } 141 }
142
130 function validPassword(pwd) { 143 function validPassword(pwd) {
131 if (!pwd || pwd.length < 8 || pwd.length > 18) { 144 if (!pwd || pwd.length < 8 || pwd.length > 18) {
132 return false 145 return false
...@@ -140,48 +153,52 @@ function validPassword(pwd) { ...@@ -140,48 +153,52 @@ function validPassword(pwd) {
140 } 153 }
141 154
142 function handleClick() { 155 function handleClick() {
143 if(!form.value.oldPassword){ 156 if (!form.value.oldPassword) {
144 uni.showToast({ 157 uni.showToast({
145 icon:'none',title:`请输入旧密码` 158 icon: 'none', title: `请输入旧密码`
146 }) 159 })
147 return 160 return
148 } 161 }
149 if(!form.value.newPassword){ 162 if (!form.value.newPassword) {
150 uni.showToast({ 163 uni.showToast({
151 icon:'none',title:`请输入新密码` 164 icon: 'none', title: `请输入新密码`
152 }) 165 })
153 return 166 return
154 } 167 }
155 if(form.value.newPassword!==form.value.confirmPassword){ 168 if (form.value.newPassword !== form.value.confirmPassword) {
156 uni.showToast({ 169 uni.showToast({
157 icon:'none',title:`新密码需与确认密码一致` 170 icon: 'none', title: `新密码需与确认密码一致`
158 }) 171 })
159 return 172 return
160 } 173 }
161 174
162 if (!validPassword(form.value.newPassword)) { 175 if (!validPassword(form.value.newPassword)) {
163 uni.showModal({ 176 uni.showModal({
164 content:`密码需满足8~18位大小写字母加数字加特殊符号组合(!@#$%^&*()_+)`, 177 content: `密码需满足8~18位大小写字母加数字加特殊符号组合(!@#$%^&*()_+)`,
165 success:function(res){ 178 success: function (res) {
166 179
167 } 180 }
168 }) 181 })
169 return 182 return
170 } 183 }
171 api.updateUserPwd({oldPassword:form.value.oldPassword, newPassword:form.value.newPassword}).then(res=>{ 184 api.updateUserPwd({oldPassword: form.value.oldPassword, newPassword: form.value.newPassword}).then(res => {
172 uni.showModal({ 185 uni.showModal({
173 title:"提示", 186 title: "提示",
174 content:`修改成功，重新登录生效`, 187 content: `修改成功，重新登录生效`,
175 success: function(res) { 188 success: function (res) {
176 if (res.confirm) { 189 if (res.confirm) {
177 //确定 190 //确定
178 } 191 }
179 } 192 }
180 }) 193 })
181 }) 194 })
182 } 195 }
183 </script> 196 </script>
184 197
185 <style scoped lang="scss"> 198 <style lang="scss" scoped>
186 .mainbox{background: #fff;padding: 30rpx;margin: 30rpx;} 199 .mainbox {
200 background: #fff;
201 padding: 30rpx;
202 margin: 30rpx;
203 }
187 </style> 204 </style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!