feat: 优化 desc 组件的显示效果
This commit is contained in:
@@ -7,10 +7,9 @@ import type { DescriptionItemSchema, DescriptionProps } from './typing';
|
|||||||
|
|
||||||
import { computed, defineComponent, ref, toRefs, unref, useAttrs } from 'vue';
|
import { computed, defineComponent, ref, toRefs, unref, useAttrs } from 'vue';
|
||||||
|
|
||||||
import { ContentWrap } from '@vben/common-ui';
|
|
||||||
import { get, isFunction } from '@vben/utils';
|
import { get, isFunction } from '@vben/utils';
|
||||||
|
|
||||||
import { Descriptions } from 'ant-design-vue';
|
import { Card, Descriptions } from 'ant-design-vue';
|
||||||
|
|
||||||
const props = {
|
const props = {
|
||||||
bordered: { default: true, type: Boolean },
|
bordered: { default: true, type: Boolean },
|
||||||
@@ -171,20 +170,21 @@ export default defineComponent({
|
|||||||
const extraSlot = getSlot(slots, 'extra');
|
const extraSlot = getSlot(slots, 'extra');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ContentWrap
|
<Card
|
||||||
class="text-base"
|
bodyStyle={{ padding: '8px 0' }}
|
||||||
headerClass={props.bordered ? 'p-4' : 'border-none p-4'}
|
headStyle={{
|
||||||
|
padding: '8px 16px',
|
||||||
|
fontSize: '14px',
|
||||||
|
minHeight: '24px',
|
||||||
|
}}
|
||||||
|
style={{ margin: 0 }}
|
||||||
|
title={title}
|
||||||
>
|
>
|
||||||
{{
|
{{
|
||||||
default: () => content,
|
default: () => content,
|
||||||
title: () => (
|
extra: () => extraSlot && <div>{extraSlot}</div>,
|
||||||
<div class="mb-2 flex w-full items-center justify-between text-base">
|
|
||||||
<div>{title}</div>
|
|
||||||
{extraSlot && <div>{extraSlot}</div>}
|
|
||||||
</div>
|
|
||||||
),
|
|
||||||
}}
|
}}
|
||||||
</ContentWrap>
|
</Card>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user