mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2026-08-01 19:05:47 +00:00
fix(form,table): groupList分界线、空状态、actions只存在一个
TAPD: --story=134235103
This commit is contained in:
parent
596d86f2ab
commit
dec4ebfa20
@ -38,3 +38,14 @@
|
|||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 最外层的groupList需要每个item需要增加空白区域界限时,增加outer-gorup_list可以实现 */
|
||||||
|
.m-container-group-list {
|
||||||
|
&.outer-gorup_list {
|
||||||
|
> .m-fields-group-list {
|
||||||
|
> .m-fields-group-list-item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -92,4 +92,15 @@
|
|||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.m-fields-group-list {
|
||||||
|
.el-table__empty-block {
|
||||||
|
.el-table__empty-text {
|
||||||
|
width: 100%;
|
||||||
|
background-color: rgba(0, 0, 0, 0.03);
|
||||||
|
margin-top: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -17,6 +17,7 @@
|
|||||||
:width="action.subActionConfig?.popoverWidth"
|
:width="action.subActionConfig?.popoverWidth"
|
||||||
:popper-class="action.subActionConfig?.popoverClass"
|
:popper-class="action.subActionConfig?.popoverClass"
|
||||||
:destroy-on-close="action.subActionConfig?.popoverDestroyOnClose ?? true"
|
:destroy-on-close="action.subActionConfig?.popoverDestroyOnClose ?? true"
|
||||||
|
@clickoutside="popoverVisible = false"
|
||||||
>
|
>
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<TMagicButton
|
<TMagicButton
|
||||||
@ -84,8 +85,15 @@
|
|||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts">
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
|
|
||||||
|
// 所有行共享:同一时间仅允许一个 sub-actions 气泡展开,激活新的会自动关闭上一个
|
||||||
|
const activePopoverId = ref<symbol | null>(null);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { watch } from 'vue';
|
||||||
import { ArrowDown, ArrowRight } from '@element-plus/icons-vue';
|
import { ArrowDown, ArrowRight } from '@element-plus/icons-vue';
|
||||||
import { cloneDeep } from 'lodash-es';
|
import { cloneDeep } from 'lodash-es';
|
||||||
|
|
||||||
@ -117,7 +125,23 @@ const props = withDefaults(
|
|||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const popoverId = Symbol('sub-actions-popover');
|
||||||
const popoverVisible = ref(false);
|
const popoverVisible = ref(false);
|
||||||
|
|
||||||
|
watch(popoverVisible, (visible) => {
|
||||||
|
if (visible) {
|
||||||
|
activePopoverId.value = popoverId;
|
||||||
|
} else if (activePopoverId.value === popoverId) {
|
||||||
|
activePopoverId.value = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(activePopoverId, (id) => {
|
||||||
|
if (id !== popoverId && popoverVisible.value) {
|
||||||
|
popoverVisible.value = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
const togglePopover = () => {
|
const togglePopover = () => {
|
||||||
popoverVisible.value = !popoverVisible.value;
|
popoverVisible.value = !popoverVisible.value;
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user