fix: 修复在菜单、部门管理中,表格展开后启用或关闭全屏功能时,表格高度未自动适应的问题

This commit is contained in:
xiaoxian521 2024-09-24 08:42:46 +08:00
parent 0004f1318c
commit 281675bdaf
5 changed files with 29 additions and 13 deletions

View File

@ -54,7 +54,7 @@ const props = {
export default defineComponent({
name: "PureTableBar",
props,
emits: ["refresh"],
emits: ["refresh", "fullscreen"],
setup(props, { emit, slots, attrs }) {
const size = ref("default");
const loading = ref(false);
@ -117,6 +117,11 @@ export default defineComponent({
toggleRowExpansionAll(props.tableRef.data, isExpandAll.value);
}
function onFullscreen() {
isFullscreen.value = !isFullscreen.value;
emit("fullscreen", isFullscreen.value);
}
function toggleRowExpansionAll(data, isExpansion) {
data.forEach(item => {
props.tableRef.toggleRowExpansion(item, isExpansion);
@ -378,7 +383,7 @@ export default defineComponent({
class={["w-[16px]", iconClass.value]}
icon={isFullscreen.value ? ExitFullscreen : Fullscreen}
v-tippy={isFullscreen.value ? "退出全屏" : "全屏"}
onClick={() => (isFullscreen.value = !isFullscreen.value)}
onClick={() => onFullscreen()}
/>
</div>
</div>

View File

@ -52,7 +52,7 @@ const props = {
export default defineComponent({
name: "VxeTableBar",
props,
emits: ["refresh"],
emits: ["refresh", "fullscreen"],
setup(props, { emit, slots, attrs }) {
const size = ref("small");
const loading = ref(false);
@ -113,6 +113,11 @@ export default defineComponent({
props.vxeTableRef.refreshColumn();
}
function onFullscreen() {
isFullscreen.value = !isFullscreen.value;
emit("fullscreen", isFullscreen.value);
}
function reloadColumn() {
const curCheckedColumns = cloneDeep(dynamicColumns.value).filter(item =>
checkedColumns.value.includes(item.title)
@ -369,7 +374,7 @@ export default defineComponent({
class={["w-[16px]", iconClass.value]}
icon={isFullscreen.value ? ExitFullscreen : Fullscreen}
v-tippy={isFullscreen.value ? "退出全屏" : "全屏"}
onClick={() => (isFullscreen.value = !isFullscreen.value)}
onClick={() => onFullscreen()}
/>
</div>
</div>

View File

@ -26,6 +26,11 @@ const {
handleDelete,
handleSelectionChange
} = useDept();
function onFullscreen() {
//
tableRef.value.setAdaptive();
}
</script>
<template>
@ -75,6 +80,7 @@ const {
:columns="columns"
:tableRef="tableRef?.getTableRef()"
@refresh="onSearch"
@fullscreen="onFullscreen"
>
<template #buttons>
<el-button

View File

@ -27,6 +27,11 @@ const {
handleDelete,
handleSelectionChange
} = useMenu();
function onFullscreen() {
//
tableRef.value.setAdaptive();
}
</script>
<template>
@ -66,6 +71,7 @@ const {
:isExpandAll="false"
:tableRef="tableRef?.getTableRef()"
@refresh="onSearch"
@fullscreen="onFullscreen"
>
<template #buttons>
<el-button

View File

@ -1,6 +1,6 @@
import { tableData } from "../data";
import { ref, onMounted } from "vue";
import { clone, delay } from "@pureadmin/utils";
import { clone } from "@pureadmin/utils";
export function useColumns() {
const dataList = ref([]);
@ -38,14 +38,8 @@ export function useColumns() {
}
onMounted(() => {
delay(600).then(() => {
const newList = [];
Array.from({ length: 6 }).forEach(() => {
newList.push(clone(tableData, true));
});
newList.flat(Infinity).forEach((item, index) => {
dataList.value.push({ id: index, ...item });
});
clone(tableData, true).forEach((item, index) => {
dataList.value.push({ id: index, ...item });
});
});