JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-04-05 19:41:40 +08:00
Code Issues Projects Releases Wiki Activity

feat(table): formatter添加index信息

Browse Source
This commit is contained in:
roymondchen 2025-02-18 19:46:00 +08:00
parent 6f2c6b151d
commit 4d77b669ba
4 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/table/src/PopoverColumn.vue
View File

@ -16,7 +16,9 @@
:data="(config.prop && scope.row[config.prop]) || []" :data="(config.prop && scope.row[config.prop]) || []"
></MTable> ></MTable>
<template #reference> <template #reference>
<TMagicButton link type="primary"> {{ config.text || formatter(config, scope.row) }}</TMagicButton> <TMagicButton link type="primary">
{{ config.text || formatter(config, scope.row, { index: scope.$index }) }}</TMagicButton
>
</template> </template>
</TMagicPopover> </TMagicPopover>
</template> </template>

8
packages/table/src/TextColumn.vue
View File

@ -29,7 +29,7 @@
type="primary" type="primary"
@click="config.handler?.(scope.row)" @click="config.handler?.(scope.row)"
> >
<span v-html="formatter(config, scope.row)"></span> <span v-html="formatter(config, scope.row, { index: scope.$index })"></span>
</TMagicButton> </TMagicButton>
<a v-else-if="config.action === 'img' && config.prop" target="_blank" :href="scope.row[config.prop]" <a v-else-if="config.action === 'img' && config.prop" target="_blank" :href="scope.row[config.prop]"
@ -46,7 +46,7 @@
<el-tooltip v-else-if="config.action === 'tip'" placement="left"> <el-tooltip v-else-if="config.action === 'tip'" placement="left">
<template #content> <template #content>
<div>{{ formatter(config, scope.row) }}</div> <div>{{ formatter(config, scope.row, { index: scope.$index }) }}</div>
</template> </template>
<TMagicButton link type="primary">{{ config.buttonText || '扩展配置' }}</TMagicButton> <TMagicButton link type="primary">{{ config.buttonText || '扩展配置' }}</TMagicButton>
</el-tooltip> </el-tooltip>
@ -55,9 +55,9 @@
v-else-if="config.action === 'tag' && config.prop" v-else-if="config.action === 'tag' && config.prop"
:type="typeof config.type === 'function' ? config.type(scope.row[config.prop], scope.row) : config.type" :type="typeof config.type === 'function' ? config.type(scope.row[config.prop], scope.row) : config.type"
close-transition close-transition
>{{ formatter(config, scope.row) }}</TMagicTag >{{ formatter(config, scope.row, { index: scope.$index }) }}</TMagicTag
> >
<div v-else v-html="formatter(config, scope.row)"></div> <div v-else v-html="formatter(config, scope.row, { index: scope.$index })"></div>
</template> </template>
</TMagicTableColumn> </TMagicTableColumn>
</template> </template>

2
packages/table/src/schema.ts
View File

@ -51,7 +51,7 @@ export interface ColumnConfig<T = any> {
name?: string; name?: string;
showHeader?: boolean; showHeader?: boolean;
table?: ColumnConfig[]; table?: ColumnConfig[];
formatter?: 'datetime' | ((item: any, row: T) => any); formatter?: 'datetime' | ((item: any, row: T, data: { index: number }) => any);
popover?: { popover?: {
placement?: placement?:
| 'auto' | 'auto'

4
packages/table/src/utils.ts
View File

@ -20,7 +20,7 @@ import { datetimeFormatter } from '@tmagic/form';
import type { ColumnConfig } from './schema'; import type { ColumnConfig } from './schema';
export const formatter = (item: ColumnConfig, row: any) => { export const formatter = (item: ColumnConfig, row: any, data: { index: number }) => {
if (!item.prop) return ''; if (!item.prop) return '';
if (item.formatter) { if (item.formatter) {
@ -29,7 +29,7 @@ export const formatter = (item: ColumnConfig, row: any) => {
item.formatter = (value: string) => datetimeFormatter(value); item.formatter = (value: string) => datetimeFormatter(value);
} }
try { try {
return item.formatter(row[item.prop], row); return item.formatter(row[item.prop], row, data);
} catch (e) { } catch (e) {
return row[item.prop]; return row[item.prop];
} }