fix: 个人中心头像为空时不能修改

This commit is contained in:
xingyu 2023-08-28 17:53:45 +08:00
parent e8dce93d66
commit e6a9dd0e4c
2 changed files with 5 additions and 5 deletions

View File

@ -1,6 +1,7 @@
<template> <template>
<div class="user-info-head" @click="open()"> <div class="user-info-head" @click="open()">
<img v-if="sourceValue" :src="sourceValue" alt="avatar" class="img-circle img-lg" /> <img v-if="sourceValue" :src="sourceValue" alt="avatar" class="img-circle img-lg" />
<img v-if="!sourceValue" :src="avatar" alt="avatar" class="img-circle img-lg" />
<el-button v-if="showBtn" :class="`${prefixCls}-upload-btn`" @click="open()"> <el-button v-if="showBtn" :class="`${prefixCls}-upload-btn`" @click="open()">
{{ btnText ? btnText : t('cropper.selectImage') }} {{ btnText ? btnText : t('cropper.selectImage') }}
</el-button> </el-button>
@ -17,6 +18,7 @@ import { useDesign } from '@/hooks/web/useDesign'
import { propTypes } from '@/utils/propTypes' import { propTypes } from '@/utils/propTypes'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import CopperModal from './CopperModal.vue' import CopperModal from './CopperModal.vue'
import avatar from '@/assets/imgs/avatar.jpg'
defineOptions({ name: 'CropperAvatar' }) defineOptions({ name: 'CropperAvatar' })

View File

@ -4,7 +4,7 @@
ref="cropperRef" ref="cropperRef"
:btnProps="{ preIcon: 'ant-design:cloud-upload-outlined' }" :btnProps="{ preIcon: 'ant-design:cloud-upload-outlined' }"
:showBtn="false" :showBtn="false"
:value="avatar" :value="img"
width="120px" width="120px"
@change="handelUpload" @change="handelUpload"
/> />
@ -13,15 +13,13 @@
<script lang="ts" setup> <script lang="ts" setup>
import { propTypes } from '@/utils/propTypes' import { propTypes } from '@/utils/propTypes'
import { uploadAvatar } from '@/api/system/user/profile' import { uploadAvatar } from '@/api/system/user/profile'
import { CropperAvatar } from '@/components/Cropper'
defineOptions({ name: 'UserAvatar' }) defineOptions({ name: 'UserAvatar' })
const props = defineProps({ defineProps({
img: propTypes.string.def('') img: propTypes.string.def('')
}) })
const avatar = computed(() => {
return props.img
})
const cropperRef = ref() const cropperRef = ref()
const handelUpload = async ({ data }) => { const handelUpload = async ({ data }) => {