mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-01-24 10:33:50 +08:00
perf(table): fixed code style
修复一些代码检查警告,并且为table的canResize属性添加不兼容场景警告 close: #1070
This commit is contained in:
parent
30c5fc63c8
commit
da12da9d8c
@ -5,3 +5,5 @@ import pageWrapper from './src/PageWrapper.vue';
|
||||
|
||||
export const PageFooter = withInstall(pageFooter);
|
||||
export const PageWrapper = withInstall(pageWrapper);
|
||||
|
||||
export const PageWrapperFixedHeightKey = 'PageWrapperFixedHeight';
|
||||
|
@ -33,7 +33,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import type { CSSProperties, PropType } from 'vue';
|
||||
import { CSSProperties, PropType, provide } from 'vue';
|
||||
|
||||
import { defineComponent, computed, watch, ref, unref } from 'vue';
|
||||
import PageFooter from './PageFooter.vue';
|
||||
@ -43,6 +43,7 @@
|
||||
import { omit } from 'lodash-es';
|
||||
import { PageHeader } from 'ant-design-vue';
|
||||
import { useContentHeight } from '/@/hooks/web/useContentHeight';
|
||||
import { PageWrapperFixedHeightKey } from '..';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'PageWrapper',
|
||||
@ -68,6 +69,11 @@
|
||||
const footerRef = ref(null);
|
||||
const { prefixCls } = useDesign('page-wrapper');
|
||||
|
||||
provide(
|
||||
PageWrapperFixedHeightKey,
|
||||
computed(() => props.fixedHeight)
|
||||
);
|
||||
|
||||
const getIsContentFullHeight = computed(() => {
|
||||
return props.contentFullHeight;
|
||||
});
|
||||
|
@ -39,9 +39,10 @@
|
||||
ColumnChangeParam,
|
||||
} from './types/table';
|
||||
|
||||
import { defineComponent, ref, computed, unref, toRaw } from 'vue';
|
||||
import { defineComponent, ref, computed, unref, toRaw, inject, watchEffect } from 'vue';
|
||||
import { Table } from 'ant-design-vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { PageWrapperFixedHeightKey } from '/@/components/Page';
|
||||
import expandIcon from './components/ExpandIcon';
|
||||
import HeaderCell from './components/HeaderCell.vue';
|
||||
import { InnerHandlers } from './types/table';
|
||||
@ -64,6 +65,7 @@
|
||||
import { omit } from 'lodash-es';
|
||||
import { basicProps } from './props';
|
||||
import { isFunction } from '/@/utils/is';
|
||||
import { warn } from '/@/utils/log';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
@ -104,6 +106,13 @@
|
||||
return { ...props, ...unref(innerPropsRef) } as BasicTableProps;
|
||||
});
|
||||
|
||||
const isFixedHeightPage = inject(PageWrapperFixedHeightKey);
|
||||
watchEffect(() => {
|
||||
unref(isFixedHeightPage) &&
|
||||
props.canResize &&
|
||||
warn("[BasicTable] 'canRize' not worked with PageWrapper while 'fixedHeight' is true");
|
||||
});
|
||||
|
||||
const { getLoading, setLoading } = useLoading(getProps);
|
||||
const {
|
||||
getPaginationInfo,
|
||||
@ -380,9 +389,9 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ant-table-tbody > tr.ant-table-row-selected td {
|
||||
//.ant-table-tbody > tr.ant-table-row-selected td {
|
||||
//background-color: fade(@primary-color, 8%) !important;
|
||||
}
|
||||
//}
|
||||
}
|
||||
|
||||
.ant-pagination {
|
||||
|
@ -21,9 +21,11 @@ export function useTableForm(
|
||||
};
|
||||
});
|
||||
|
||||
const getFormSlotKeys = computed(() => {
|
||||
const getFormSlotKeys: ComputedRef<string[]> = computed(() => {
|
||||
const keys = Object.keys(slots);
|
||||
return keys.map((item) => (item.startsWith('form-') ? item : null)).filter(Boolean);
|
||||
return keys
|
||||
.map((item) => (item.startsWith('form-') ? item : null))
|
||||
.filter((item) => !!item) as string[];
|
||||
});
|
||||
|
||||
function replaceFormSlotKey(key: string) {
|
||||
|
@ -1,21 +1,22 @@
|
||||
<template>
|
||||
<div class="p-4">
|
||||
<PageWrapper contentBackground contentClass="flex" dense contentFullHeight fixedHeight>
|
||||
<BasicTable @register="registerTable">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleReloadCurrent"> 刷新当前页 </a-button>
|
||||
<a-button type="primary" @click="handleReload"> 刷新并返回第一页 </a-button>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { BasicTable, useTable } from '/@/components/Table';
|
||||
import { getBasicColumns } from './tableData';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
|
||||
import { demoListApi } from '/@/api/demo/table';
|
||||
export default defineComponent({
|
||||
components: { BasicTable },
|
||||
components: { BasicTable, PageWrapper },
|
||||
setup() {
|
||||
const [registerTable, { reload }] = useTable({
|
||||
title: '远程加载示例',
|
||||
|
Loading…
Reference in New Issue
Block a user