| | |
|---|
| | | <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
|
|---|
| | |
|---|
| | | previews: {}
|
|---|
| | | };
|
|---|
| | | },
|
|---|
| | | created() {
|
|---|
| | | // 显隐列组件默认隐藏列
|
|---|
| | | for (let item in this.columns) {
|
|---|
| | | if (this.columns[item].visible === false) {
|
|---|
| | | this.value.push(parseInt(item))
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | // 编辑头像
|
|---|
| | | editCropper() {
|
|---|
| | |
|---|
| | | // 上传预处理
|
|---|
| | | beforeUpload(file) {
|
|---|
| | | if (file.type.indexOf("image/") == -1) {
|
|---|
| | | this.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
|
|---|
| | | this.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
|
|---|
| | | } else {
|
|---|
| | | const reader = new FileReader();
|
|---|
| | | reader.readAsDataURL(file);
|
|---|
| | |
|---|
| | | this.open = false;
|
|---|
| | | this.options.img = process.env.VUE_APP_BASE_API + response.imgUrl;
|
|---|
| | | store.commit('SET_AVATAR', this.options.img);
|
|---|
| | | this.msgSuccess("修改成功");
|
|---|
| | | this.$modal.msgSuccess("修改成功");
|
|---|
| | | this.visible = false;
|
|---|
| | | });
|
|---|
| | | });
|
|---|
| | |
|---|
| | | realTime(data) {
|
|---|
| | | this.previews = data;
|
|---|
| | | },
|
|---|
| | | //取消截图，关闭对话框
|
|---|
| | | // 关闭窗口
|
|---|
| | | closeDialog() {
|
|---|
| | | this.options.img = store.getters.avatar
|
|---|
| | | this.visible = false;
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | };
|
|---|
