types: fix CropperAvatar props define

This commit is contained in:
无木 2021-07-04 09:29:57 +08:00
parent 735028c430
commit f1c0e0c52b
1 changed files with 16 additions and 5 deletions

View File

@ -29,7 +29,16 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, computed, CSSProperties, unref, ref, watchEffect, watch } from 'vue'; import {
defineComponent,
computed,
CSSProperties,
unref,
ref,
watchEffect,
watch,
PropType,
} from 'vue';
import CopperModal from './CopperModal.vue'; import CopperModal from './CopperModal.vue';
import { useDesign } from '/@/hooks/web/useDesign'; import { useDesign } from '/@/hooks/web/useDesign';
import { useModal } from '/@/components/Modal'; import { useModal } from '/@/components/Modal';
@ -42,7 +51,7 @@
width: { type: [String, Number], default: '200px' }, width: { type: [String, Number], default: '200px' },
value: { type: String }, value: { type: String },
showBtn: { type: Boolean, default: true }, showBtn: { type: Boolean, default: true },
btnProps: { type: Object as ButtonProps }, btnProps: { type: Object as PropType<ButtonProps> },
btnText: { type: String, default: '' }, btnText: { type: String, default: '' },
uploadApi: { type: Function as PropType<({ file: Blob, name: string }) => Promise<void>> }, uploadApi: { type: Function as PropType<({ file: Blob, name: string }) => Promise<void>> },
}; };
@ -52,10 +61,10 @@
components: { CopperModal, Icon }, components: { CopperModal, Icon },
props, props,
emits: ['update:value', 'change'], emits: ['update:value', 'change'],
setup(props, { emit }) { setup(props, { emit, expose }) {
const sourceValue = ref(props.value || ''); const sourceValue = ref(props.value || '');
const { prefixCls } = useDesign('cropper-avatar'); const { prefixCls } = useDesign('cropper-avatar');
const [register, { openModal }] = useModal(); const [register, { openModal, closeModal }] = useModal();
const { createMessage } = useMessage(); const { createMessage } = useMessage();
const { t } = useI18n(); const { t } = useI18n();
@ -72,7 +81,7 @@
); );
watchEffect(() => { watchEffect(() => {
sourceValue.value = props.value; sourceValue.value = props.value || '';
}); });
watch( watch(
@ -88,6 +97,8 @@
createMessage.success(t('component.cropper.uploadSuccess')); createMessage.success(t('component.cropper.uploadSuccess'));
} }
expose({ openModal: openModal.bind(null, true), closeModal });
return { return {
t, t,
prefixCls, prefixCls,