|
|
@@ -13,7 +13,7 @@
|
|
|
<slot></slot>
|
|
|
</div>
|
|
|
<a-descriptions v-if="!isEmpty(items)" :bordered="false" v-bind="extraProps">
|
|
|
- <a-descriptions-item v-for="(item, index) in items.filter(v => !v.visible)" :key="index" v-bind="item.extraProps" >
|
|
|
+ <a-descriptions-item v-bind="item.extraProps" v-for="(item, index) in items.filter((v) => !v.visible)" :key="index" :class="calculateClass(item)">
|
|
|
<template #label>
|
|
|
<slot v-if="item.labelSlot" :name="item.labelSlot" :label="item.label" :value="item.value"></slot>
|
|
|
|
|
|
@@ -81,7 +81,14 @@
|
|
|
const emits = defineEmits(['update:isFolded']);
|
|
|
|
|
|
const slots = useSlots();
|
|
|
-
|
|
|
+ const calculateClass = (item) => {
|
|
|
+ if (item.directionColumn) {
|
|
|
+ return 'flex-direction-column';
|
|
|
+ }
|
|
|
+ if (item.noLabelMark) {
|
|
|
+ return 'no-label-after';
|
|
|
+ }
|
|
|
+ };
|
|
|
const handleClkHeader = () => {
|
|
|
foldState.value = !foldState.value;
|
|
|
};
|
|
|
@@ -152,10 +159,19 @@
|
|
|
.default_slot {
|
|
|
padding: 10px 0;
|
|
|
}
|
|
|
- .value_slot {
|
|
|
- position: absolute;
|
|
|
- bottom: 0;
|
|
|
- transform: translateY(100%);
|
|
|
+
|
|
|
+ :deep(.flex-direction-column .ant-descriptions-item-container) {
|
|
|
+ flex-direction: column !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.no-label-after .ant-descriptions-item-label::after) {
|
|
|
+ content: '';
|
|
|
}
|
|
|
+
|
|
|
+ // .value_slot {
|
|
|
+ // position: absolute;
|
|
|
+ // bottom: 0;
|
|
|
+ // transform: translateY(100%);
|
|
|
+ // }
|
|
|
}
|
|
|
</style>
|