feat(abc:st): add index argument of format (#644)

ng-alain · Jul 10, 2019 · 498d0b7 · 498d0b7
1 parent 7a47208
commit 498d0b7
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 19 deletions.
diff --git a/packages/abc/table/demo/sort.md b/packages/abc/table/demo/sort.md
@@ -20,8 +20,8 @@ import { STColumn } from '@delon/abc';
 @Component({
   selector: 'app-demo',
   template: `
-  <button nz-button (click)="st.reset()">重置</button>
-  <st #st [data]="url" [req]="{params: params}" [columns]="columns" multiSort></st>
+    <button nz-button (click)="st.reset()">重置</button>
+    <st #st [data]="url" [req]="{ params: params }" [columns]="columns" multiSort></st>
   `,
 })
 export class DemoComponent {
@@ -33,29 +33,22 @@ export class DemoComponent {
     {
       title: '姓名',
       index: 'name.last',
-      format: (item: any) => `${item.name.last} ${item.name.first}`,
+      format: (item, _col, index) => `${index + 1}: ${item.name.last} ${item.name.first}`,
       sort: true,
     },
     {
       title: '国家',
       index: 'nat',
       filter: {
-        menus: [
-          { text: '中国', value: 'CH' },
-          { text: '美国', value: 'US' },
-          { text: '德国', value: 'DE' },
-        ],
+        menus: [{ text: '中国', value: 'CH' }, { text: '美国', value: 'US' }, { text: '德国', value: 'DE' }],
       },
       sort: true,
     },
     {
       title: '性别',
       index: 'gender',
       filter: {
-        menus: [
-          { text: 'male', value: 'male' },
-          { text: 'female', value: 'female' },
-        ],
+        menus: [{ text: 'male', value: 'male' }, { text: 'female', value: 'female' }],
         multiple: false,
       },
       sort: true,

diff --git a/packages/abc/table/index.en-US.md b/packages/abc/table/index.en-US.md
@@ -235,7 +235,7 @@ Property | Description | Type | Default
 `[buttons]` | Buttons of this column | `STColumnButton[]` | -
 `[width]` | Width of this column (**NOTICE:** If the fixed column must be a number), e.g: `100`, `10%`, `100px` | `string,number` | -
 `[fixed]` | Set column to be fixed, must specify `width` | `left,right` | -
-`[format]` | Format value of this column | `(item: STData, col: STColumn) => string` | -
+`[format]` | Format value of this column | `(item: STData, col: STColumn, index: number) => string` | -
 `[className]` | Class name of this column, e.g: `text-center`, `text-right`, `text-danger`, pls refer to [Style Tools](/theme/tools) | `string` | -
 `[colSpan]` | Span of this column's title | `number` | -
 `[sort]` | Sort config of this column, Remote Data Configuration**Priority** Rule: <br>`true` allow sorting<br>`string` corresponding `key` value| `true,string,STColumnSort` | -

diff --git a/packages/abc/table/index.zh-CN.md b/packages/abc/table/index.zh-CN.md
@@ -228,7 +228,7 @@ class TestComponent {
 `[buttons]` | 按钮组 | `STColumnButton[]` | -
 `[width]` | 列宽（数字型表示 `px` 值，**注意：** 若固定列必须是数字），例如：`100`、`10%`、`100px` | `string,number` | -
 `[fixed]` | 固定前后列，当指定时务必指定 `width` 否则视为无效 | `left,right` | -
-`[format]` | 格式化列值 | `(item: STData, col: STColumn) => string` | -
+`[format]` | 格式化列值 | `(item: STData, col: STColumn, index: number) => string` | -
 `[className]` | 列 `class` 属性值，例如：；`text-center` 居中； `text-right` 居右； `text-danger` 异常色，更多参考[样式工具类](/theme/tools) | `string` | -
 `[colSpan]` | 合并列 | `number` | -
 `[sort]` | 排序配置项，远程数据配置**优先**规则：<br>`true` 表示允许排序<br>`string` 表示远程数据排序相对应 `key` 值 | `true,string,STColumnSort` | -

diff --git a/packages/abc/table/table-data-source.ts b/packages/abc/table/table-data-source.ts
@@ -196,7 +196,7 @@ export class STDataSource {
 
   private get(item: STData, col: STColumn, idx: number): { text: any; org?: any } {
     if (col.format) {
-      const formatRes = col.format(item, col);
+      const formatRes = col.format(item, col, idx);
       if (formatRes && ~formatRes.indexOf('</')) {
         return { text: this.dom.bypassSecurityTrustHtml(formatRes), org: formatRes };
       }

diff --git a/packages/abc/table/table-export.ts b/packages/abc/table/table-export.ts
@@ -8,11 +8,11 @@ import { STColumn, STExportOptions } from './table.interfaces';
 export class STExport {
   constructor(@Optional() private xlsxSrv: XlsxService) {}
 
-  private _stGet(item: any, col: STColumn): any {
+  private _stGet(item: any, col: STColumn, index: number): any {
     const ret: { [key: string]: any } = { t: 's', v: '' };
 
     if (col.format) {
-      ret.v = col.format(item, col);
+      ret.v = col.format(item, col, index);
     } else {
       const val = deepGet(item, col.index as string[], '');
       ret.v = val;
@@ -50,7 +50,7 @@ export class STExport {
     // content
     for (let i = 0; i < dc; i++) {
       for (let j = 0; j < cc; j++) {
-        sheet[`${String.fromCharCode(j + 65)}${i + 2}`] = this._stGet(opt._d![i], colData[j]);
+        sheet[`${String.fromCharCode(j + 65)}${i + 2}`] = this._stGet(opt._d![i], colData[j], i);
       }
     }
 

diff --git a/packages/abc/table/table.interfaces.ts b/packages/abc/table/table.interfaces.ts
@@ -261,7 +261,7 @@ export interface STColumn {
   /**
    * 格式化列值
    */
-  format?: (item: STData, col: STColumn) => string;
+  format?: (item: STData, col: STColumn, index: number) => string;
   /**
    * 自定义全/反选选择项
    */