fix: table search form slot not working as expected
parent
24d14c2841
commit
ea962e75d0
|
@ -4,4 +4,4 @@ outline: deep
|
||||||
|
|
||||||
# Vben Vxe Table 表格
|
# Vben Vxe Table 表格
|
||||||
|
|
||||||
TODO
|
文档待补充,如果需要使用,可先行查看 vxe-table 文档和 示例代码,内部有部分注释。
|
||||||
|
|
|
@ -1,9 +1,11 @@
|
||||||
import type { VxeGridProps } from 'vxe-table';
|
import type { VxeGridProps, VxeUIExport } from 'vxe-table';
|
||||||
|
|
||||||
import type { VxeGridApi } from './api';
|
import type { VxeGridApi } from './api';
|
||||||
|
|
||||||
import { isFunction } from '@vben/utils';
|
import { isFunction } from '@vben/utils';
|
||||||
|
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
|
||||||
export function extendProxyOptions(
|
export function extendProxyOptions(
|
||||||
api: VxeGridApi,
|
api: VxeGridApi,
|
||||||
options: VxeGridProps,
|
options: VxeGridProps,
|
||||||
|
@ -48,3 +50,17 @@ function extendProxyOption(
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function extendsDefaultFormatter(vxeUI: VxeUIExport) {
|
||||||
|
vxeUI.formats.add('formatDate', {
|
||||||
|
tableCellFormatMethod({ cellValue }) {
|
||||||
|
return dayjs(cellValue).format('YYYY-MM-DD');
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
vxeUI.formats.add('formatDateTime', {
|
||||||
|
tableCellFormatMethod({ cellValue }) {
|
||||||
|
return dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss');
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
|
@ -1,17 +0,0 @@
|
||||||
import type { VxeUIExport } from 'vxe-table';
|
|
||||||
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
|
|
||||||
export function initDefaultFormatter(vxeUI: VxeUIExport) {
|
|
||||||
vxeUI.formats.add('formatDate', {
|
|
||||||
tableCellFormatMethod({ cellValue }) {
|
|
||||||
return dayjs(cellValue).format('YYYY-MM-DD');
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
vxeUI.formats.add('formatDateTime', {
|
|
||||||
tableCellFormatMethod({ cellValue }) {
|
|
||||||
return dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss');
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
|
@ -41,7 +41,7 @@ import {
|
||||||
VxeToolbar,
|
VxeToolbar,
|
||||||
} from 'vxe-table';
|
} from 'vxe-table';
|
||||||
|
|
||||||
import { initDefaultFormatter } from './formatter';
|
import { extendsDefaultFormatter } from './extends';
|
||||||
|
|
||||||
// 是否加载过
|
// 是否加载过
|
||||||
let isInit = false;
|
let isInit = false;
|
||||||
|
@ -120,6 +120,7 @@ export function setupVbenVxeTable(setupOptions: SetupVxeTable) {
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
initDefaultFormatter(VxeUI);
|
extendsDefaultFormatter(VxeUI);
|
||||||
|
|
||||||
configVxeTable(VxeUI);
|
configVxeTable(VxeUI);
|
||||||
}
|
}
|
||||||
|
|
|
@ -204,7 +204,7 @@ async function init() {
|
||||||
'[Vben Vxe Table]: The formConfig in the grid is not supported, please use the `formOptions` props',
|
'[Vben Vxe Table]: The formConfig in the grid is not supported, please use the `formOptions` props',
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
props.api?.setState?.({ gridOptions: defaultGridOptions });
|
||||||
// form 由 vben-form 代替,所以需要保证query相关事件可以拿到参数
|
// form 由 vben-form 代替,所以需要保证query相关事件可以拿到参数
|
||||||
extendProxyOptions(props.api, defaultGridOptions, () => formApi.form.values);
|
extendProxyOptions(props.api, defaultGridOptions, () => formApi.form.values);
|
||||||
}
|
}
|
||||||
|
@ -267,7 +267,10 @@ onMounted(() => {
|
||||||
:key="slotName"
|
:key="slotName"
|
||||||
#[slotName]="slotProps"
|
#[slotName]="slotProps"
|
||||||
>
|
>
|
||||||
<slot :name="slotName" v-bind="slotProps"></slot>
|
<slot
|
||||||
|
:name="`${FORM_SLOT_PREFIX}${slotName}`"
|
||||||
|
v-bind="slotProps"
|
||||||
|
></slot>
|
||||||
</template>
|
</template>
|
||||||
</Form>
|
</Form>
|
||||||
</slot>
|
</slot>
|
||||||
|
|
|
@ -18,10 +18,12 @@ interface RowType {
|
||||||
}
|
}
|
||||||
|
|
||||||
const formOptions: VbenFormProps = {
|
const formOptions: VbenFormProps = {
|
||||||
collapsed: true,
|
// 默认展开
|
||||||
|
collapsed: false,
|
||||||
schema: [
|
schema: [
|
||||||
{
|
{
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
|
defaultValue: '1',
|
||||||
fieldName: 'category',
|
fieldName: 'category',
|
||||||
label: 'Category',
|
label: 'Category',
|
||||||
},
|
},
|
||||||
|
|
|
@ -27,6 +27,9 @@ const gridOptions: VxeGridProps<RowType> = {
|
||||||
{ field: 'date', title: 'Date' },
|
{ field: 'date', title: 'Date' },
|
||||||
],
|
],
|
||||||
data: MOCK_TREE_TABLE_DATA,
|
data: MOCK_TREE_TABLE_DATA,
|
||||||
|
pagerConfig: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
treeConfig: {
|
treeConfig: {
|
||||||
parentField: 'parentId',
|
parentField: 'parentId',
|
||||||
rowField: 'id',
|
rowField: 'id',
|
||||||
|
|
|
@ -23,6 +23,9 @@ const gridOptions: VxeGridProps<RowType> = {
|
||||||
],
|
],
|
||||||
data: [],
|
data: [],
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
|
pagerConfig: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
scrollY: {
|
scrollY: {
|
||||||
enabled: true,
|
enabled: true,
|
||||||
gt: 0,
|
gt: 0,
|
||||||
|
|
|
@ -457,8 +457,8 @@ catalogs:
|
||||||
specifier: ^7.4.6
|
specifier: ^7.4.6
|
||||||
version: 7.4.6
|
version: 7.4.6
|
||||||
vitepress:
|
vitepress:
|
||||||
specifier: ^1.4.0
|
specifier: ^1.4.1
|
||||||
version: 1.4.0
|
version: 1.4.1
|
||||||
vitepress-plugin-group-icons:
|
vitepress-plugin-group-icons:
|
||||||
specifier: ^1.2.4
|
specifier: ^1.2.4
|
||||||
version: 1.2.4
|
version: 1.2.4
|
||||||
|
@ -853,7 +853,7 @@ importers:
|
||||||
version: 0.5.3(vite-plugin-pwa@0.20.5(vite@5.4.8(@types/node@22.7.5)(less@4.2.0)(sass@1.79.5)(terser@5.34.1))(workbox-build@7.1.1)(workbox-window@7.1.0))
|
version: 0.5.3(vite-plugin-pwa@0.20.5(vite@5.4.8(@types/node@22.7.5)(less@4.2.0)(sass@1.79.5)(terser@5.34.1))(workbox-build@7.1.1)(workbox-window@7.1.0))
|
||||||
vitepress:
|
vitepress:
|
||||||
specifier: 'catalog:'
|
specifier: 'catalog:'
|
||||||
version: 1.4.0(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
version: 1.4.1(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
||||||
vue:
|
vue:
|
||||||
specifier: ^3.5.12
|
specifier: ^3.5.12
|
||||||
version: 3.5.12(typescript@5.6.3)
|
version: 3.5.12(typescript@5.6.3)
|
||||||
|
@ -10094,8 +10094,8 @@ packages:
|
||||||
vitepress-plugin-group-icons@1.2.4:
|
vitepress-plugin-group-icons@1.2.4:
|
||||||
resolution: {integrity: sha512-pxYzphvRy0Jhpgl3lHszH9Z8Qaj83v4bVr0b8Oi4zSIOQW/uuqGAZ8SaYwkZ1f/8a6ckIeIwZiLfLHA6ySCScQ==}
|
resolution: {integrity: sha512-pxYzphvRy0Jhpgl3lHszH9Z8Qaj83v4bVr0b8Oi4zSIOQW/uuqGAZ8SaYwkZ1f/8a6ckIeIwZiLfLHA6ySCScQ==}
|
||||||
|
|
||||||
vitepress@1.4.0:
|
vitepress@1.4.1:
|
||||||
resolution: {integrity: sha512-JXCv4EsKTDyAFb6C/UjZr7nsGAzZ6mafVk2rx7rG5o8N+B/4QstIk+iEOe/9dKoU6V624UIC6g1pZ+K63rxhlw==}
|
resolution: {integrity: sha512-C2rQ7PMlDVqgsaHOa0uJtgGGWaGv74QMaGL62lxKbtFkYtosJB5HAfZ8+pEbfzzvLemYaYwaiQdFLBlexK2sFw==}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
markdown-it-mathjax3: ^4
|
markdown-it-mathjax3: ^4
|
||||||
|
@ -12772,7 +12772,7 @@ snapshots:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@iconify-json/octicon': 1.2.1
|
'@iconify-json/octicon': 1.2.1
|
||||||
less: 4.2.0
|
less: 4.2.0
|
||||||
vitepress: 1.4.0(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
vitepress: 1.4.1(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
||||||
vue: 3.5.12(typescript@5.6.3)
|
vue: 3.5.12(typescript@5.6.3)
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- '@algolia/client-search'
|
- '@algolia/client-search'
|
||||||
|
@ -12816,7 +12816,7 @@ snapshots:
|
||||||
gray-matter: 4.0.3
|
gray-matter: 4.0.3
|
||||||
less: 4.2.0
|
less: 4.2.0
|
||||||
uncrypto: 0.1.3
|
uncrypto: 0.1.3
|
||||||
vitepress: 1.4.0(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
vitepress: 1.4.1(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3)
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- '@algolia/client-search'
|
- '@algolia/client-search'
|
||||||
- '@types/node'
|
- '@types/node'
|
||||||
|
@ -19617,7 +19617,7 @@ snapshots:
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- supports-color
|
- supports-color
|
||||||
|
|
||||||
vitepress@1.4.0(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3):
|
vitepress@1.4.1(@algolia/client-search@4.24.0)(@types/node@22.7.5)(async-validator@4.2.5)(axios@1.7.7)(less@4.2.0)(nprogress@0.2.0)(postcss@8.4.47)(qrcode@1.5.4)(sass@1.79.5)(search-insights@2.17.2)(sortablejs@1.15.3)(terser@5.34.1)(typescript@5.6.3):
|
||||||
dependencies:
|
dependencies:
|
||||||
'@docsearch/css': 3.6.2
|
'@docsearch/css': 3.6.2
|
||||||
'@docsearch/js': 3.6.2(@algolia/client-search@4.24.0)(search-insights@2.17.2)
|
'@docsearch/js': 3.6.2(@algolia/client-search@4.24.0)(search-insights@2.17.2)
|
||||||
|
|
|
@ -166,7 +166,7 @@ catalog:
|
||||||
vite-plugin-lib-inject-css: ^2.1.1
|
vite-plugin-lib-inject-css: ^2.1.1
|
||||||
vite-plugin-pwa: ^0.20.5
|
vite-plugin-pwa: ^0.20.5
|
||||||
vite-plugin-vue-devtools: ^7.4.6
|
vite-plugin-vue-devtools: ^7.4.6
|
||||||
vitepress: ^1.4.0
|
vitepress: ^1.4.1
|
||||||
vitepress-plugin-group-icons: ^1.2.4
|
vitepress-plugin-group-icons: ^1.2.4
|
||||||
vitest: ^2.1.2
|
vitest: ^2.1.2
|
||||||
vue: ^3.5.12
|
vue: ^3.5.12
|
||||||
|
|
Loading…
Reference in New Issue