|
@@ -2,7 +2,7 @@
|
|
|
<Drawer v-bind="getBindValues" :class="prefixCls" @close="onClose">
|
|
|
<template #title v-if="!$slots.title">
|
|
|
<DrawerHeader
|
|
|
- :title="mergeProps.title"
|
|
|
+ :title="getMergeProps.title"
|
|
|
:isDetail="isDetail"
|
|
|
:showDetailBack="showDetailBack"
|
|
|
@close="onClose"
|
|
@@ -32,8 +32,8 @@
|
|
|
</template>
|
|
|
<script lang="ts" setup>
|
|
|
import type { DrawerInstance, DrawerProps } from './typing';
|
|
|
- import type { CSSProperties } from 'vue';
|
|
|
- import { ref, computed, watch, unref, nextTick, toRaw, getCurrentInstance } from 'vue';
|
|
|
+ import { ref, computed, watch, unref, nextTick, getCurrentInstance } from 'vue';
|
|
|
+ import type { CSSProperties, Ref } from 'vue';
|
|
|
import { Drawer } from 'ant-design-vue';
|
|
|
import { useI18n } from '@/hooks/web/useI18n';
|
|
|
import { isFunction, isNumber } from '@/utils/is';
|
|
@@ -53,13 +53,13 @@
|
|
|
|
|
|
const openRef = ref(false);
|
|
|
const attrs = useAttrs();
|
|
|
- const propsRef = ref<Partial<DrawerProps | null>>(null);
|
|
|
+ const propsRef = ref({}) as Ref<Partial<DrawerProps>>;
|
|
|
|
|
|
const { t } = useI18n();
|
|
|
const { prefixVar, prefixCls } = useDesign('basic-drawer');
|
|
|
|
|
|
const drawerInstance: DrawerInstance = {
|
|
|
- setDrawerProps: setDrawerProps as any,
|
|
|
+ setDrawerProps,
|
|
|
emitOpen: undefined,
|
|
|
};
|
|
|
|
|
@@ -67,12 +67,12 @@
|
|
|
|
|
|
instance && emit('register', drawerInstance, instance.uid);
|
|
|
|
|
|
- const getMergeProps = computed((): DrawerProps => {
|
|
|
- return deepMerge(toRaw(props), unref(propsRef)) as any;
|
|
|
+ const getMergeProps = computed(() => {
|
|
|
+ return deepMerge(props, unref(propsRef));
|
|
|
});
|
|
|
|
|
|
- const getProps = computed((): DrawerProps => {
|
|
|
- const opt = {
|
|
|
+ const getProps = computed(() => {
|
|
|
+ const opt: Partial<DrawerProps> = {
|
|
|
placement: 'right',
|
|
|
...unref(attrs),
|
|
|
...unref(getMergeProps),
|
|
@@ -91,10 +91,10 @@
|
|
|
opt.getContainer = `.${prefixVar}-layout-content`;
|
|
|
}
|
|
|
}
|
|
|
- return opt as DrawerProps;
|
|
|
+ return opt;
|
|
|
});
|
|
|
|
|
|
- const getBindValues = computed((): DrawerProps => {
|
|
|
+ const getBindValues = computed(() => {
|
|
|
return {
|
|
|
...attrs,
|
|
|
...unref(getProps),
|
|
@@ -152,9 +152,9 @@
|
|
|
openRef.value = false;
|
|
|
}
|
|
|
|
|
|
- function setDrawerProps(props: Partial<DrawerProps>): void {
|
|
|
+ function setDrawerProps(props: Partial<DrawerProps>) {
|
|
|
// Keep the last setDrawerProps
|
|
|
- propsRef.value = deepMerge(unref(propsRef) || ({} as any), props);
|
|
|
+ propsRef.value = deepMerge(unref(propsRef), props);
|
|
|
|
|
|
if (Reflect.has(props, 'open')) {
|
|
|
openRef.value = !!props.open;
|
|
@@ -164,8 +164,6 @@
|
|
|
function handleOk() {
|
|
|
emit('ok');
|
|
|
}
|
|
|
-
|
|
|
- const mergeProps = getMergeProps as any;
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
@header-height: 60px;
|