github/tmagic-editor
1
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2026-04-23 18:28:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(form): table 全屏每次进入重新获取 z-index

Browse Source 
close #672

Made-with: Cursor
This commit is contained in:
roymondchen 2026-04-23 17:19:52 +08:00
parent e106c081c8
commit 9ba12e97af
1 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/form/src/table/Table.vue
View File

@ -4,7 +4,7 @@
v-bind="$attrs" v-bind="$attrs"
class="m-fields-table-wrap" class="m-fields-table-wrap"
:class="{ fixed: isFullscreen }" :class="{ fixed: isFullscreen }"
:style="isFullscreen ? `z-index: ${nextZIndex()}` : ''" :style="isFullscreen ? `z-index: ${fullscreenZIndex}` : ''"
> >
<div class="m-fields-table" :class="{ 'm-fields-table-item-extra': config.itemExtra }"> <div class="m-fields-table" :class="{ 'm-fields-table-item-extra': config.itemExtra }">
<span v-if="config.extra" style="color: rgba(0, 0, 0, 0.45)" v-html="config.extra"></span> <span v-if="config.extra" style="color: rgba(0, 0, 0, 0.45)" v-html="config.extra"></span>
@ -80,7 +80,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, ref, useTemplateRef } from 'vue'; import { computed, ref, useTemplateRef, watch } from 'vue';
import { FullScreen } from '@element-plus/icons-vue'; import { FullScreen } from '@element-plus/icons-vue';
import { TMagicButton, TMagicPagination, TMagicTable, TMagicTooltip, TMagicUpload, useZIndex } from '@tmagic/design'; import { TMagicButton, TMagicPagination, TMagicTable, TMagicTooltip, TMagicUpload, useZIndex } from '@tmagic/design';
@ -122,11 +122,19 @@ const { pageSize, currentPage, paginationData, handleSizeChange, handleCurrentCh
const { nextZIndex } = useZIndex(); const { nextZIndex } = useZIndex();
const updateKey = ref(1); const updateKey = ref(1);
const fullscreenZIndex = ref(nextZIndex());
const { newHandler } = useAdd(props, emit); const { newHandler } = useAdd(props, emit);
const { columns } = useTableColumns(props, emit, currentPage, pageSize, modelName); const { columns } = useTableColumns(props, emit, currentPage, pageSize, modelName);
useSortable(props, emit, tMagicTableRef, modelName, updateKey); useSortable(props, emit, tMagicTableRef, modelName, updateKey);
const { isFullscreen, toggleFullscreen } = useFullscreen(); const { isFullscreen, toggleFullscreen } = useFullscreen();
watch(isFullscreen, (value) => {
if (value) {
fullscreenZIndex.value = nextZIndex();
}
});
const { importable, excelHandler, clearHandler } = useImport(props, emit, newHandler); const { importable, excelHandler, clearHandler } = useImport(props, emit, newHandler);
const { selectHandle, toggleRowSelection } = useSelection(props, emit, tMagicTableRef); const { selectHandle, toggleRowSelection } = useSelection(props, emit, tMagicTableRef);