From a8d5644f2e9700b0986df935a0a57a51dc2bb439 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子li <15040126243@163.com> Date: 星期一, 06 二月 2023 09:43:45 +0800 Subject: [PATCH] add 新增 加密插件配置 --- ruoyi-ui/src/views/system/user/profile/userAvatar.vue | 37 ++++++++++++++++++++++++++----------- 1 files changed, 26 insertions(+), 11 deletions(-) diff --git a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue index 3d1b9ef..18b23a4 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> <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-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 @@ -12,6 +12,7 @@ :autoCropWidth="options.autoCropWidth" :autoCropHeight="options.autoCropHeight" :fixedBox="options.fixedBox" + :outputType="options.outputType" @realTime="realTime" v-if="visible" /> @@ -24,7 +25,7 @@ </el-row> <br /> <el-row> - <el-col :lg="2" :md="2"> + <el-col :lg="2" :sm="3" :xs="3"> <el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload"> <el-button size="small"> 閫夋嫨 @@ -32,19 +33,19 @@ </el-button> </el-upload> </el-col> - <el-col :lg="{span: 1, offset: 2}" :md="2"> + <el-col :lg="{span: 1, offset: 2}" :sm="2" :xs="2"> <el-button icon="el-icon-plus" size="small" @click="changeScale(1)"></el-button> </el-col> - <el-col :lg="{span: 1, offset: 1}" :md="2"> + <el-col :lg="{span: 1, offset: 1}" :sm="2" :xs="2"> <el-button icon="el-icon-minus" size="small" @click="changeScale(-1)"></el-button> </el-col> - <el-col :lg="{span: 1, offset: 1}" :md="2"> + <el-col :lg="{span: 1, offset: 1}" :sm="2" :xs="2"> <el-button icon="el-icon-refresh-left" size="small" @click="rotateLeft()"></el-button> </el-col> - <el-col :lg="{span: 1, offset: 1}" :md="2"> + <el-col :lg="{span: 1, offset: 1}" :sm="2" :xs="2"> <el-button icon="el-icon-refresh-right" size="small" @click="rotateRight()"></el-button> </el-col> - <el-col :lg="{span: 2, offset: 6}" :md="2"> + <el-col :lg="{span: 2, offset: 6}" :sm="2" :xs="2"> <el-button type="primary" size="small" @click="uploadImg()">鎻� 浜�</el-button> </el-col> </el-row> @@ -56,6 +57,7 @@ import store from "@/store"; import { VueCropper } from "vue-cropper"; import { uploadAvatar } from "@/api/system/user"; +import { debounce } from '@/utils' export default { components: { VueCropper }, @@ -78,9 +80,11 @@ autoCropWidth: 200, // 榛樿鐢熸垚鎴浘妗嗗搴� autoCropHeight: 200, // 榛樿鐢熸垚鎴浘妗嗛珮搴� fixedBox: true, // 鍥哄畾鎴浘妗嗗ぇ灏� 涓嶅厑璁告敼鍙� + outputType:"png", // 榛樿鐢熸垚鎴浘涓篜NG鏍煎紡 filename: '' }, - previews: {} + previews: {}, + resizeHandler: null }; }, methods: { @@ -91,6 +95,16 @@ // 鎵撳紑寮瑰嚭灞傜粨鏉熸椂鐨勫洖璋� modalOpened() { this.visible = true; + if (!this.resizeHandler) { + this.resizeHandler = debounce(() => { + this.refresh() + }, 100) + } + window.addEventListener("resize", this.resizeHandler) + }, + // 鍒锋柊缁勪欢 + refresh() { + this.$refs.cropper.refresh(); }, // 瑕嗙洊榛樿鐨勪笂浼犺涓� requestUpload() { @@ -111,7 +125,7 @@ // 涓婁紶棰勫鐞� 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); @@ -131,7 +145,7 @@ this.open = false; this.options.img = response.data.imgUrl; store.commit('SET_AVATAR', this.options.img); - this.msgSuccess("淇敼鎴愬姛"); + this.$modal.msgSuccess("淇敼鎴愬姛"); this.visible = false; }); }); @@ -143,7 +157,8 @@ // 鍏抽棴绐楀彛 closeDialog() { this.options.img = store.getters.avatar - this.visible = false; + this.visible = false; + window.removeEventListener("resize", this.resizeHandler) } } }; -- Gitblit v1.9.3