提交 da12da9d 编写于 作者: 无木

perf(table): fixed code style

修复一些代码检查警告,并且为table的canResize属性添加不兼容场景警告

close: #1070
上级 30c5fc63
...@@ -5,3 +5,5 @@ import pageWrapper from './src/PageWrapper.vue'; ...@@ -5,3 +5,5 @@ import pageWrapper from './src/PageWrapper.vue';
export const PageFooter = withInstall(pageFooter); export const PageFooter = withInstall(pageFooter);
export const PageWrapper = withInstall(pageWrapper); export const PageWrapper = withInstall(pageWrapper);
export const PageWrapperFixedHeightKey = 'PageWrapperFixedHeight';
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import type { CSSProperties, PropType } from 'vue'; import { CSSProperties, PropType, provide } from 'vue';
import { defineComponent, computed, watch, ref, unref } from 'vue'; import { defineComponent, computed, watch, ref, unref } from 'vue';
import PageFooter from './PageFooter.vue'; import PageFooter from './PageFooter.vue';
...@@ -43,6 +43,7 @@ ...@@ -43,6 +43,7 @@
import { omit } from 'lodash-es'; import { omit } from 'lodash-es';
import { PageHeader } from 'ant-design-vue'; import { PageHeader } from 'ant-design-vue';
import { useContentHeight } from '/@/hooks/web/useContentHeight'; import { useContentHeight } from '/@/hooks/web/useContentHeight';
import { PageWrapperFixedHeightKey } from '..';
export default defineComponent({ export default defineComponent({
name: 'PageWrapper', name: 'PageWrapper',
...@@ -68,6 +69,11 @@ ...@@ -68,6 +69,11 @@
const footerRef = ref(null); const footerRef = ref(null);
const { prefixCls } = useDesign('page-wrapper'); const { prefixCls } = useDesign('page-wrapper');
provide(
PageWrapperFixedHeightKey,
computed(() => props.fixedHeight)
);
const getIsContentFullHeight = computed(() => { const getIsContentFullHeight = computed(() => {
return props.contentFullHeight; return props.contentFullHeight;
}); });
......
...@@ -39,9 +39,10 @@ ...@@ -39,9 +39,10 @@
ColumnChangeParam, ColumnChangeParam,
} from './types/table'; } 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 { Table } from 'ant-design-vue';
import { BasicForm, useForm } from '/@/components/Form/index'; import { BasicForm, useForm } from '/@/components/Form/index';
import { PageWrapperFixedHeightKey } from '/@/components/Page';
import expandIcon from './components/ExpandIcon'; import expandIcon from './components/ExpandIcon';
import HeaderCell from './components/HeaderCell.vue'; import HeaderCell from './components/HeaderCell.vue';
import { InnerHandlers } from './types/table'; import { InnerHandlers } from './types/table';
...@@ -64,6 +65,7 @@ ...@@ -64,6 +65,7 @@
import { omit } from 'lodash-es'; import { omit } from 'lodash-es';
import { basicProps } from './props'; import { basicProps } from './props';
import { isFunction } from '/@/utils/is'; import { isFunction } from '/@/utils/is';
import { warn } from '/@/utils/log';
export default defineComponent({ export default defineComponent({
components: { components: {
...@@ -104,6 +106,13 @@ ...@@ -104,6 +106,13 @@
return { ...props, ...unref(innerPropsRef) } as BasicTableProps; 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 { getLoading, setLoading } = useLoading(getProps);
const { const {
getPaginationInfo, getPaginationInfo,
...@@ -380,9 +389,9 @@ ...@@ -380,9 +389,9 @@
align-items: center; 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; //background-color: fade(@primary-color, 8%) !important;
} //}
} }
.ant-pagination { .ant-pagination {
......
...@@ -21,9 +21,11 @@ export function useTableForm( ...@@ -21,9 +21,11 @@ export function useTableForm(
}; };
}); });
const getFormSlotKeys = computed(() => { const getFormSlotKeys: ComputedRef<string[]> = computed(() => {
const keys = Object.keys(slots); 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) { function replaceFormSlotKey(key: string) {
......
<template> <template>
<div class="p-4"> <PageWrapper contentBackground contentClass="flex" dense contentFullHeight fixedHeight>
<BasicTable @register="registerTable"> <BasicTable @register="registerTable">
<template #toolbar> <template #toolbar>
<a-button type="primary" @click="handleReloadCurrent"> 刷新当前页 </a-button> <a-button type="primary" @click="handleReloadCurrent"> 刷新当前页 </a-button>
<a-button type="primary" @click="handleReload"> 刷新并返回第一页 </a-button> <a-button type="primary" @click="handleReload"> 刷新并返回第一页 </a-button>
</template> </template>
</BasicTable> </BasicTable>
</div> </PageWrapper>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
import { BasicTable, useTable } from '/@/components/Table'; import { BasicTable, useTable } from '/@/components/Table';
import { getBasicColumns } from './tableData'; import { getBasicColumns } from './tableData';
import { PageWrapper } from '/@/components/Page';
import { demoListApi } from '/@/api/demo/table'; import { demoListApi } from '/@/api/demo/table';
export default defineComponent({ export default defineComponent({
components: { BasicTable }, components: { BasicTable, PageWrapper },
setup() { setup() {
const [registerTable, { reload }] = useTable({ const [registerTable, { reload }] = useTable({
title: '远程加载示例', title: '远程加载示例',
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册