From 74f52677be7718d63eef89e01c367058a2e43e57 Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期一, 10 八月 2020 10:12:39 +0800 Subject: [PATCH] 表格右侧工具栏组件 --- ruoyi-ui/src/views/system/user/profile/userAvatar.vue | 21 +++++++++++++++------ 1 files changed, 15 insertions(+), 6 deletions(-) diff --git a/ruoyi-ui/src/views/system/user/profile/userAvatar.vue b/ruoyi-ui/src/views/system/user/profile/userAvatar.vue index bca0493..8f60085 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"> + <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @opened="modalOpened"> <el-row> <el-col :xs="24" :md="12" :style="{height: '350px'}"> <vue-cropper @@ -13,6 +13,7 @@ :autoCropHeight="options.autoCropHeight" :fixedBox="options.fixedBox" @realTime="realTime" + v-if="visible" /> </el-col> <el-col :xs="24" :md="12" :style="{height: '350px'}"> @@ -24,7 +25,7 @@ <br /> <el-row> <el-col :lg="2" :md="2"> - <el-upload :show-file-list="false" :before-upload="beforeUpload"> + <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> @@ -44,7 +45,7 @@ <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-button type="primary" size="small" @click="uploadImg()">上 传</el-button> + <el-button type="primary" size="small" @click="uploadImg()">提 交</el-button> </el-col> </el-row> </el-dialog> @@ -67,6 +68,8 @@ return { // 是否显示弹出层 open: false, + // 是否显示cropper + visible: false, // 弹出层标题 title: "修改头像", options: { @@ -83,6 +86,13 @@ // 编辑头像 editCropper() { this.open = true; + }, + // 打开弹出层结束时的回调 + modalOpened() { + this.visible = true; + }, + // 覆盖默认的上传行为 + requestUpload() { }, // 向左旋转 rotateLeft() { @@ -118,11 +128,10 @@ if (response.code === 200) { this.open = false; this.options.img = process.env.VUE_APP_BASE_API + response.imgUrl; + store.commit('SET_AVATAR', this.options.img); this.msgSuccess("修改成功"); - } else { - this.msgError(response.msg); } - this.$refs.cropper.clearCrop(); + this.visible = false; }); }); }, -- Gitblit v1.9.2