正在显示
2 个修改的文件
包含
283 行增加
和
239 行删除
1 | 1 | <template> |
2 | - <view class="account_safe" :style="vuex_theme"> | |
3 | - | |
4 | - <view class="avatar"> | |
5 | - <u-image @click="show = true" width="190rpx" height="190rpx" shape="circle" | |
6 | - :src="avatarUrl? `${vuex_ossUrlPubilc}/${avatarUrl}`:wxAvatarUrl" /> | |
7 | - </view> | |
8 | - | |
9 | - <view class="cell top"> | |
10 | - <u-cell-group> | |
11 | - <u-cell title="登录账号" :isLink="true" url="/pages/main/my/editAccount/editAccount" arrow-direction="right" | |
12 | - :rightIconStyle="{fontSize:'26rpx'}" :title-style="{color:'#909097', fontSize:'28rpx'}"> | |
13 | - <text slot="value" class="u-slot-value">{{accountName}}</text> | |
14 | - </u-cell> | |
15 | - <u-cell title="姓名" arrow-direction="right" :rightIconStyle="{fontSize:'26rpx'}" | |
16 | - :title-style="{color:'#909097', fontSize:'28rpx'}"> | |
17 | - <text slot="value" class="u-slot-value">{{teacherName}}</text> | |
18 | - </u-cell> | |
19 | - <u-cell title="手机号" :isLink="true" url="/pages/main/my/editMobile/editMobile" arrow-direction="right" | |
20 | - :rightIconStyle="{fontSize:'26rpx'}" :title-style="{color:'#909097', fontSize:'28rpx'}"> | |
21 | - <text slot="value" class="u-slot-value">{{getPhone}}</text> | |
22 | - </u-cell> | |
23 | - <u-cell title="工号" arrow-direction="right" :rightIconStyle="{fontSize:'26rpx'}" | |
24 | - :title-style="{color:'#909097', fontSize:'28rpx'}"> | |
25 | - <text slot="value" class="u-slot-value">{{jobNumber}}</text> | |
26 | - </u-cell> | |
27 | - <u-cell title="院系专业" arrow-direction="right" :rightIconStyle="{fontSize:'26rpx'}" | |
28 | - :title-style="{color:'#909097', fontSize:'28rpx'}"> | |
29 | - <text slot="value" class="u-slot-value">{{departmentName}}</text> | |
30 | - </u-cell> | |
31 | - </u-cell-group> | |
32 | - </view> | |
33 | - | |
34 | - <u-action-sheet :actions="list" @select="chooseImg" :show="show"></u-action-sheet> | |
35 | - </view> | |
2 | + <view class="account_safe" :style="vuex_theme"> | |
3 | + <view class="avatar"> | |
4 | + <u-image | |
5 | + @click="show = true" | |
6 | + width="190rpx" | |
7 | + height="190rpx" | |
8 | + shape="circle" | |
9 | + :src=" | |
10 | + avatarUrl | |
11 | + ? `${vuex_ossUrlPubilc}/${avatarUrl}` | |
12 | + : '/static/img/my/default_avatar.png' | |
13 | + " | |
14 | + /> | |
15 | + </view> | |
16 | + | |
17 | + <view class="cell top"> | |
18 | + <u-cell-group> | |
19 | + <u-cell | |
20 | + title="登录账号" | |
21 | + :isLink="true" | |
22 | + url="/pages/main/my/editAccount/editAccount" | |
23 | + arrow-direction="right" | |
24 | + :rightIconStyle="{ fontSize: '26rpx' }" | |
25 | + :title-style="{ color: '#909097', fontSize: '28rpx' }" | |
26 | + > | |
27 | + <text slot="value" class="u-slot-value">{{ accountName }}</text> | |
28 | + </u-cell> | |
29 | + <u-cell | |
30 | + title="姓名" | |
31 | + arrow-direction="right" | |
32 | + :rightIconStyle="{ fontSize: '26rpx' }" | |
33 | + :title-style="{ color: '#909097', fontSize: '28rpx' }" | |
34 | + > | |
35 | + <text slot="value" class="u-slot-value">{{ teacherName }}</text> | |
36 | + </u-cell> | |
37 | + <u-cell | |
38 | + title="手机号" | |
39 | + :isLink="true" | |
40 | + url="/pages/main/my/editMobile/editMobile" | |
41 | + arrow-direction="right" | |
42 | + :rightIconStyle="{ fontSize: '26rpx' }" | |
43 | + :title-style="{ color: '#909097', fontSize: '28rpx' }" | |
44 | + > | |
45 | + <text slot="value" class="u-slot-value">{{ getPhone }}</text> | |
46 | + </u-cell> | |
47 | + <u-cell | |
48 | + title="工号" | |
49 | + arrow-direction="right" | |
50 | + :rightIconStyle="{ fontSize: '26rpx' }" | |
51 | + :title-style="{ color: '#909097', fontSize: '28rpx' }" | |
52 | + > | |
53 | + <text slot="value" class="u-slot-value">{{ jobNumber }}</text> | |
54 | + </u-cell> | |
55 | + <u-cell | |
56 | + title="院系专业" | |
57 | + arrow-direction="right" | |
58 | + :rightIconStyle="{ fontSize: '26rpx' }" | |
59 | + :title-style="{ color: '#909097', fontSize: '28rpx' }" | |
60 | + > | |
61 | + <view slot="value"> | |
62 | + <view v-for="(item, index) in departmentName" v-bind:key="index">{{item.departmentName ? `${item.departmentName}/${item.name}` : item.name}}</view> | |
63 | + </view> | |
64 | + </u-cell> | |
65 | + </u-cell-group> | |
66 | + </view> | |
67 | + | |
68 | + <u-action-sheet | |
69 | + :actions="list" | |
70 | + @select="chooseImg" | |
71 | + :show="show" | |
72 | + ></u-action-sheet> | |
73 | + </view> | |
36 | 74 | </template> |
37 | 75 | |
38 | 76 | <script> |
39 | - import { | |
40 | - mapState, | |
41 | - mapActions | |
42 | - } from 'vuex' | |
43 | - | |
44 | - import { | |
45 | - getOssInitApi, | |
46 | - updateAvatarUrlApi, | |
47 | - } from '@/config/api.js'; | |
48 | - | |
49 | - import { | |
50 | - replaceTextToStar | |
51 | - } from '@/common/commonUtil.js' | |
52 | - | |
53 | - export default { | |
54 | - data() { | |
55 | - return { | |
56 | - show: false, | |
57 | - list: [{ | |
58 | - name: '拍照' | |
59 | - }, { | |
60 | - name: '从手机相册选择' | |
61 | - }], | |
62 | - ossInit: {}, | |
63 | - picList: [], | |
64 | - } | |
65 | - }, | |
66 | - | |
67 | - onLoad() { | |
68 | - getOssInitApi({ | |
69 | - "uploadFileType": "other" | |
70 | - }).then(res => { | |
71 | - this.ossInit = res | |
72 | - }) | |
73 | - }, | |
74 | - | |
75 | - | |
76 | - | |
77 | - computed: { | |
78 | - ...mapState({ | |
79 | - wxAvatarUrl: (state) => state.vuex_weixinUserInfo.avatarUrl ? state.vuex_weixinUserInfo.avatarUrl : '', | |
80 | - avatarUrl: (state) => state.vuex_user.teacher.avatarUrl ? state.vuex_user.teacher.avatarUrl : '', | |
81 | - accountName: (state) => state.vuex_user.username ? state.vuex_user.username : '', | |
82 | - teacherName: (state) => state.vuex_user.teacher.name ? state.vuex_user.teacher.name : '', | |
83 | - jobNumber: (state) => state.vuex_user.teacher.number ? state.vuex_user.teacher.number : '', | |
84 | - departmentName: (state) => state.vuex_user.teacher.departments && state.vuex_user.teacher.departments | |
85 | - .length > 0 && state.vuex_user.teacher.departments[0].name ? state.vuex_user.teacher | |
86 | - .departments[0].name : '', | |
87 | - | |
88 | - getPhone(state) { | |
89 | - let phone = state.vuex_user.phone; | |
90 | - return phone ? replaceTextToStar(phone) : ''; | |
91 | - }, | |
92 | - | |
93 | - }), | |
94 | - }, | |
95 | - | |
96 | - methods: { | |
97 | - | |
98 | - ...mapActions('user', { | |
99 | - getUserInfo: 'getUserInfo', | |
100 | - }), | |
101 | - | |
102 | - chooseImg(item) { | |
103 | - var _this = this | |
104 | - console.log(item) | |
105 | - if (item.name == '拍照') { //拍照 | |
106 | - uni.chooseImage({ | |
107 | - count: 1, | |
108 | - sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 | |
109 | - sourceType: ['camera'], //从相机选择 | |
110 | - success: function(res) { | |
111 | - console.log("chooseImage...", JSON.stringify(res.tempFilePaths)); | |
112 | - _this.picList = res.tempFilePaths | |
113 | - _this.uploadImages() | |
114 | - } | |
115 | - }); | |
116 | - } else if (item.name == '从手机相册选择') { //相册 | |
117 | - uni.chooseImage({ | |
118 | - count: 1, | |
119 | - sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 | |
120 | - sourceType: ['album'], //从相册选择 | |
121 | - success: function(res) { | |
122 | - console.log("chooseImage...", JSON.stringify(res.tempFilePaths)); | |
123 | - _this.picList = res.tempFilePaths | |
124 | - _this.uploadImages() | |
125 | - } | |
126 | - }); | |
127 | - } | |
128 | - }, | |
129 | - | |
130 | - uploadImages() { //上传图片 | |
131 | - var _this = this | |
132 | - console.log('begin', this.picList) | |
133 | - | |
134 | - let formdata = {} | |
135 | - if (this.ossInit.uploadType == 'minio') { | |
136 | - formdata = { | |
137 | - 'bucket': _this.ossInit.bucket, | |
138 | - 'dir': _this.ossInit.dir, | |
139 | - 'fileName': `${_this.ossInit.dir}${new Date().getTime()}/` + '${filename}', | |
140 | - 'accessId': _this.ossInit.accessId, | |
141 | - 'policy': _this.ossInit.policy | |
142 | - } | |
143 | - }else { | |
144 | - formdata = { | |
145 | - 'key': `${_this.ossInit.dir}${new Date().getTime()}/` + '${filename}', | |
146 | - // 'key': `${_this.ossInit.dir}${new Date().getTime()}`, | |
147 | - 'action': `${_this.ossInit.host}`, | |
148 | - 'OSSAccessKeyId': _this.ossInit.accessId, | |
149 | - 'policy': _this.ossInit.policy, | |
150 | - 'signature': _this.ossInit.signature, | |
151 | - 'callback': _this.ossInit.callback, | |
152 | - } | |
153 | - } | |
154 | - for (var i = 0; i < this.picList.length; i++) { | |
155 | - uni.uploadFile({ | |
156 | - url: _this.ossInit.host, | |
157 | - filePath: _this.picList[i], | |
158 | - name: 'file', | |
159 | - formData: formdata, | |
160 | - success: (uploadFileRes) => { | |
161 | - console.log("--", uploadFileRes) | |
162 | - | |
163 | - let avatarObj = JSON.parse(uploadFileRes.data) | |
164 | - _this.avatarUrl = avatarObj.object; | |
165 | - | |
166 | - updateAvatarUrlApi({ | |
167 | - id: this.vuex_user.teacher.id, | |
168 | - avatarUrl: avatarObj.object, | |
169 | - }).then(data => { | |
170 | - if (data) { | |
171 | - _this.getUserInfo() | |
172 | - } | |
173 | - }) | |
174 | - | |
175 | - }, | |
176 | - fail: (error) => { | |
177 | - console.log("-error-", error) | |
178 | - }, | |
179 | - | |
180 | - complete: (res) => { | |
181 | - this.show = false; | |
182 | - } | |
183 | - | |
184 | - }); | |
185 | - } | |
186 | - }, | |
187 | - | |
188 | - link(type) { | |
189 | - | |
190 | - switch (type) { | |
191 | - case 'account': | |
192 | - this.$u.route('/pages/student/my/edit-account/edit-account'); | |
193 | - break; | |
194 | - | |
195 | - case 'password': | |
196 | - this.$u.route('/pages/student/my/edit-password/edit-password'); | |
197 | - break; | |
198 | - } | |
199 | - | |
200 | - }, | |
201 | - } | |
202 | - } | |
77 | +import { mapState, mapActions } from "vuex"; | |
78 | + | |
79 | +import { getOssInitApi, updateAvatarUrlApi } from "@/config/api.js"; | |
80 | + | |
81 | +import { replaceTextToStar } from "@/common/commonUtil.js"; | |
82 | + | |
83 | +export default { | |
84 | + data() { | |
85 | + return { | |
86 | + show: false, | |
87 | + list: [ | |
88 | + { | |
89 | + name: "拍照", | |
90 | + }, | |
91 | + { | |
92 | + name: "从手机相册选择", | |
93 | + }, | |
94 | + ], | |
95 | + ossInit: {}, | |
96 | + picList: [], | |
97 | + }; | |
98 | + }, | |
99 | + | |
100 | + onLoad() { | |
101 | + getOssInitApi({ | |
102 | + uploadFileType: "other", | |
103 | + }).then((res) => { | |
104 | + this.ossInit = res; | |
105 | + }); | |
106 | + }, | |
107 | + | |
108 | + computed: { | |
109 | + ...mapState({ | |
110 | + wxAvatarUrl: (state) => | |
111 | + state.vuex_weixinUserInfo.avatarUrl | |
112 | + ? state.vuex_weixinUserInfo.avatarUrl | |
113 | + : "", | |
114 | + avatarUrl: (state) => | |
115 | + state.vuex_user.teacher.avatarUrl | |
116 | + ? state.vuex_user.teacher.avatarUrl | |
117 | + : "", | |
118 | + accountName: (state) => | |
119 | + state.vuex_user.username ? state.vuex_user.username : "", | |
120 | + teacherName: (state) => | |
121 | + state.vuex_user.teacher.name ? state.vuex_user.teacher.name : "", | |
122 | + jobNumber: (state) => | |
123 | + state.vuex_user.teacher.number ? state.vuex_user.teacher.number : "", | |
124 | + departmentName: (state) => { | |
125 | + let departments = []; | |
126 | + if (state.vuex_user.teacher.departments) { | |
127 | + departments = [...state.vuex_user.teacher.departments]; | |
128 | + } | |
129 | + if (state.vuex_user.teacher.professionals) { | |
130 | + departments = [ | |
131 | + ...departments, | |
132 | + ...state.vuex_user.teacher.professionals, | |
133 | + ]; | |
134 | + } | |
135 | + return departments; | |
136 | + }, | |
137 | + getPhone(state) { | |
138 | + let phone = state.vuex_user.phone; | |
139 | + return phone ? replaceTextToStar(phone) : ""; | |
140 | + }, | |
141 | + }), | |
142 | + }, | |
143 | + | |
144 | + methods: { | |
145 | + ...mapActions("user", { | |
146 | + getUserInfo: "getUserInfo", | |
147 | + }), | |
148 | + | |
149 | + chooseImg(item) { | |
150 | + var _this = this; | |
151 | + console.log(item); | |
152 | + if (item.name == "拍照") { | |
153 | + //拍照 | |
154 | + uni.chooseImage({ | |
155 | + count: 1, | |
156 | + sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 | |
157 | + sourceType: ["camera"], //从相机选择 | |
158 | + success: function (res) { | |
159 | + console.log("chooseImage...", JSON.stringify(res.tempFilePaths)); | |
160 | + _this.picList = res.tempFilePaths; | |
161 | + _this.uploadImages(); | |
162 | + }, | |
163 | + }); | |
164 | + } else if (item.name == "从手机相册选择") { | |
165 | + //相册 | |
166 | + uni.chooseImage({ | |
167 | + count: 1, | |
168 | + sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 | |
169 | + sourceType: ["album"], //从相册选择 | |
170 | + success: function (res) { | |
171 | + console.log("chooseImage...", JSON.stringify(res.tempFilePaths)); | |
172 | + _this.picList = res.tempFilePaths; | |
173 | + _this.uploadImages(); | |
174 | + }, | |
175 | + }); | |
176 | + } | |
177 | + }, | |
178 | + | |
179 | + uploadImages() { | |
180 | + //上传图片 | |
181 | + var _this = this; | |
182 | + console.log("begin", this.picList); | |
183 | + | |
184 | + let formdata = {}; | |
185 | + if (this.ossInit.uploadType == "minio") { | |
186 | + formdata = { | |
187 | + bucket: _this.ossInit.bucket, | |
188 | + dir: _this.ossInit.dir, | |
189 | + fileName: | |
190 | + `${_this.ossInit.dir}${new Date().getTime()}/` + "${filename}", | |
191 | + accessId: _this.ossInit.accessId, | |
192 | + policy: _this.ossInit.policy, | |
193 | + }; | |
194 | + } else { | |
195 | + formdata = { | |
196 | + key: `${_this.ossInit.dir}${new Date().getTime()}/` + "${filename}", | |
197 | + // 'key': `${_this.ossInit.dir}${new Date().getTime()}`, | |
198 | + action: `${_this.ossInit.host}`, | |
199 | + OSSAccessKeyId: _this.ossInit.accessId, | |
200 | + policy: _this.ossInit.policy, | |
201 | + signature: _this.ossInit.signature, | |
202 | + callback: _this.ossInit.callback, | |
203 | + }; | |
204 | + } | |
205 | + for (var i = 0; i < this.picList.length; i++) { | |
206 | + uni.uploadFile({ | |
207 | + url: _this.ossInit.host, | |
208 | + filePath: _this.picList[i], | |
209 | + name: "file", | |
210 | + formData: formdata, | |
211 | + success: (uploadFileRes) => { | |
212 | + console.log("--", uploadFileRes); | |
213 | + | |
214 | + let avatarObj = JSON.parse(uploadFileRes.data); | |
215 | + _this.avatarUrl = avatarObj.object; | |
216 | + | |
217 | + updateAvatarUrlApi({ | |
218 | + id: this.vuex_user.teacher.id, | |
219 | + avatarUrl: avatarObj.object, | |
220 | + }).then((data) => { | |
221 | + if (data) { | |
222 | + _this.getUserInfo(); | |
223 | + } | |
224 | + }); | |
225 | + }, | |
226 | + fail: (error) => { | |
227 | + console.log("-error-", error); | |
228 | + }, | |
229 | + | |
230 | + complete: (res) => { | |
231 | + this.show = false; | |
232 | + }, | |
233 | + }); | |
234 | + } | |
235 | + }, | |
236 | + | |
237 | + link(type) { | |
238 | + switch (type) { | |
239 | + case "account": | |
240 | + this.$u.route("/pages/student/my/edit-account/edit-account"); | |
241 | + break; | |
242 | + | |
243 | + case "password": | |
244 | + this.$u.route("/pages/student/my/edit-password/edit-password"); | |
245 | + break; | |
246 | + } | |
247 | + }, | |
248 | + }, | |
249 | +}; | |
203 | 250 | </script> |
204 | 251 | |
205 | 252 | <style lang="scss" scoped> |
206 | - .account_safe { | |
207 | - width: 100%; | |
208 | - height: 100%; | |
209 | - background-color: #F7F7F7; | |
210 | - padding: 20rpx 0 0 0; | |
211 | - | |
212 | - .avatar { | |
213 | - width: 190rpx; | |
214 | - margin: 0 auto; | |
215 | - padding: 50rpx 0; | |
216 | - } | |
217 | - | |
218 | - .top { | |
219 | - margin: 0 0 20rpx 0; | |
220 | - } | |
221 | - | |
222 | - .cell { | |
223 | - background-color: #FFFFFF; | |
224 | - | |
225 | - .u-slot-value { | |
226 | - font-size: 28rpx; | |
227 | - line-height: 40rpx; | |
228 | - color: #202131; | |
229 | - } | |
230 | - } | |
231 | - | |
232 | - .cell /deep/ .u-cell { | |
233 | - padding: 12rpx 0; | |
234 | - | |
235 | - .u-cell__value { | |
236 | - font-size: 34rpx; | |
237 | - color: rgba(0, 0, 0, 0.5); | |
238 | - } | |
239 | - } | |
240 | - } | |
253 | +.account_safe { | |
254 | + width: 100%; | |
255 | + height: 100%; | |
256 | + background-color: #f7f7f7; | |
257 | + padding: 20rpx 0 0 0; | |
258 | + | |
259 | + .avatar { | |
260 | + width: 190rpx; | |
261 | + margin: 0 auto; | |
262 | + padding: 50rpx 0; | |
263 | + } | |
264 | + | |
265 | + .top { | |
266 | + margin: 0 0 20rpx 0; | |
267 | + } | |
268 | + | |
269 | + .cell { | |
270 | + background-color: #ffffff; | |
271 | + | |
272 | + .u-slot-value { | |
273 | + font-size: 28rpx; | |
274 | + line-height: 40rpx; | |
275 | + color: #202131; | |
276 | + } | |
277 | + } | |
278 | + | |
279 | + .cell /deep/ .u-cell { | |
280 | + | |
281 | + .u-cell__value { | |
282 | + font-size: 34rpx; | |
283 | + color: rgba(0, 0, 0, 0.5); | |
284 | + } | |
285 | + } | |
286 | +} | |
241 | 287 | </style> | ... | ... |
... | ... | @@ -27,8 +27,8 @@ const actions = { |
27 | 27 | custom: { |
28 | 28 | auth: false |
29 | 29 | } |
30 | - }); | |
31 | - | |
30 | + }); | |
31 | + | |
32 | 32 | console.log(login_result) |
33 | 33 | |
34 | 34 | if (login_result) { |
... | ... | @@ -64,10 +64,8 @@ const actions = { |
64 | 64 | uni.$u.route({ |
65 | 65 | url: 'pages/tabBar/home/home', |
66 | 66 | type: 'switchTab', |
67 | - params: { | |
68 | - | |
69 | - } | |
70 | 67 | }) |
68 | + uni.$u.vuex('vuex_tabbar_index', 0); | |
71 | 69 | } |
72 | 70 | |
73 | 71 | break; |
... | ... | @@ -139,4 +137,4 @@ export default { |
139 | 137 | getters, |
140 | 138 | actions, |
141 | 139 | mutations |
142 | -} | |
140 | +} | ... | ... |
请
注册
或
登录
后发表评论