From 42295ef2ac0a5e78674cf24b62d6834138f0ffdc Mon Sep 17 00:00:00 2001 From: 疯狂的狮子li <15040126243@163.com> Date: 星期一, 29 十一月 2021 13:56:25 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/dev' into satoken --- ruoyi-ui/src/views/system/user/profile/userAvatar.vue | 51 ++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 42 insertions(+), 9 deletions(-) diff --git a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue index 37ae1dd..d094602 100644 --- a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue +++ b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue @@ -1,7 +1,7 @@ <template> <div> - <img v-bind:src="options.img" @click="editCropper()" title="鐐瑰嚮涓婁紶澶村儚" class="img-circle img-lg" /> - <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @opened="modalOpened"> + <div class="user-info-head" @click="editCropper()"><img v-bind:src="options.img" title="鐐瑰嚮涓婁紶澶村儚" class="img-circle img-lg" /></div> + <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @opened="modalOpened" @close="closeDialog"> <el-row> <el-col :xs="24" :md="12" :style="{height: '350px'}"> <vue-cropper @@ -27,7 +27,7 @@ <el-col :lg="2" :md="2"> <el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload"> <el-button size="small"> - 涓婁紶 + 閫夋嫨 <i class="el-icon-upload el-icon--right"></i> </el-button> </el-upload> @@ -77,7 +77,8 @@ autoCrop: true, // 鏄惁榛樿鐢熸垚鎴浘妗� autoCropWidth: 200, // 榛樿鐢熸垚鎴浘妗嗗搴� autoCropHeight: 200, // 榛樿鐢熸垚鎴浘妗嗛珮搴� - fixedBox: true // 鍥哄畾鎴浘妗嗗ぇ灏� 涓嶅厑璁告敼鍙� + fixedBox: true, // 鍥哄畾鎴浘妗嗗ぇ灏� 涓嶅厑璁告敼鍙� + filename: '' }, previews: {} }; @@ -110,12 +111,13 @@ // 涓婁紶棰勫鐞� beforeUpload(file) { if (file.type.indexOf("image/") == -1) { - this.msgError("鏂囦欢鏍煎紡閿欒锛岃涓婁紶鍥剧墖绫诲瀷,濡傦細JPG锛孭NG鍚庣紑鐨勬枃浠躲��"); + this.$modal.msgError("鏂囦欢鏍煎紡閿欒锛岃涓婁紶鍥剧墖绫诲瀷,濡傦細JPG锛孭NG鍚庣紑鐨勬枃浠躲��"); } else { const reader = new FileReader(); reader.readAsDataURL(file); reader.onload = () => { this.options.img = reader.result; + this.options.filename = file.name; }; } }, @@ -123,12 +125,13 @@ uploadImg() { this.$refs.cropper.getCropBlob(data => { let formData = new FormData(); - formData.append("avatarfile", data); + console.log(this.options.filename) + formData.append("avatarfile", data, this.options.filename); uploadAvatar(formData).then(response => { this.open = false; - this.options.img = process.env.VUE_APP_BASE_API + response.imgUrl; + this.options.img = response.data.imgUrl; store.commit('SET_AVATAR', this.options.img); - this.msgSuccess("淇敼鎴愬姛"); + this.$modal.msgSuccess("淇敼鎴愬姛"); this.visible = false; }); }); @@ -136,7 +139,37 @@ // 瀹炴椂棰勮 realTime(data) { this.previews = data; + }, + // 鍏抽棴绐楀彛 + closeDialog() { + this.options.img = store.getters.avatar + this.visible = false; } } }; -</script> \ No newline at end of file +</script> +<style scoped lang="scss"> +.user-info-head { + position: relative; + display: inline-block; + height: 120px; +} + +.user-info-head:hover:after { + content: '+'; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + color: #eee; + background: rgba(0, 0, 0, 0.5); + font-size: 24px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + cursor: pointer; + line-height: 110px; + border-radius: 50%; +} +</style> -- Gitblit v1.9.3