table

自动维度

1export const TableAuto = memo(() => {
2  const vseed: VSeed = {
3    chartType: 'table',
4    dataset: [
5      { date: '2019', type: 'A', goalProfit: 10, profit: 10, sales: 100, leftCount: 1, salesCount: 100 },
6      { date: '2020', type: 'A', goalProfit: 30, profit: 30, sales: 320, leftCount: 2, salesCount: 200 },
7      { date: '2021', type: 'A', goalProfit: 30, profit: 30, sales: 300, leftCount: 3, salesCount: 300 },
8      { date: '2022', type: 'A', goalProfit: 50, profit: 50, sales: 240, leftCount: 4, salesCount: 400 },
9      { date: '2023', type: 'A', goalProfit: 40, profit: 40, sales: 500, leftCount: 5, salesCount: 500 },
10    ],
11  }
12  return <VTableTable vseed={vseed} />
13})

基础表格

1export const TableBasic = memo(() => {
2  const vseed: VSeed = {
3    chartType: 'table',
4    dataset: [
5      { date: '2019', type: 'A', goalProfit: 10, profit: 10, sales: 100, leftCount: 1, salesCount: 100 },
6      { date: '2020', type: 'A', goalProfit: 30, profit: 30, sales: 320, leftCount: 2, salesCount: 200 },
7      { date: '2021', type: 'A', goalProfit: 30, profit: 30, sales: 300, leftCount: 3, salesCount: 300 },
8      { date: '2022', type: 'A', goalProfit: 50, profit: 50, sales: 240, leftCount: 4, salesCount: 400 },
9      { date: '2023', type: 'A', goalProfit: 40, profit: 40, sales: 500, leftCount: 5, salesCount: 500 },
10    ],
11    measures: [
12      {
13        id: 'goalProfit',
14        alias: '利润目标',
15      },
16      {
17        id: 'profit',
18        alias: '利润',
19      },
20      {
21        id: 'sales',
22        alias: '销售量',
23      },
24      {
25        id: 'leftCount',
26        alias: '遗留数量',
27      },
28      {
29        id: 'salesCount',
30        alias: '销售数',
31      },
32    ],
33    dimensions: [
34      {
35        id: 'date',
36        alias: '日期',
37      },
38      {
39        id: 'type',
40        alias: '类型',
41      },
42    ],
43  }
44  return <VTableTable vseed={vseed} />
45})

分组表格

1export const TableGroup = memo(() => {
2  const vseed: VSeed = {
3    chartType: 'table',
4    dataset: [
5      { date: '2019', type: 'A', goalProfit: 10, profit: 10, sales: 100, leftCount: 1, salesCount: 100 },
6      { date: '2020', type: 'A', goalProfit: 30, profit: 30, sales: 320, leftCount: 2, salesCount: 200 },
7      { date: '2021', type: 'A', goalProfit: 30, profit: 30, sales: 300, leftCount: 3, salesCount: 300 },
8      { date: '2022', type: 'A', goalProfit: 50, profit: 50, sales: 240, leftCount: 4, salesCount: 400 },
9      { date: '2023', type: 'A', goalProfit: 40, profit: 40, sales: 500, leftCount: 5, salesCount: 500 },
10    ],
11    measures: [
12      {
13        id: 'goalProfit',
14        alias: '利润目标',
15      },
16      {
17        id: 'profit',
18        alias: '利润',
19      },
20      {
21        id: 'table',
22        alias: '销售指标',
23        children: [
24          {
25            id: 'countInfo',
26            alias: '数量信息',
27            children: [
28              {
29                id: 'leftCount',
30                alias: '遗留数量',
31              },
32              {
33                id: 'salesCount',
34                alias: '销售数',
35              },
36            ],
37          },
38          {
39            id: 'saleInfo',
40            alias: '销售信息',
41            children: [
42              {
43                id: 'sales',
44                alias: '销售量',
45              },
46            ],
47          },
48        ],
49      },
50    ],
51    dimensions: [
52      {
53        id: 'dimensionGroup',
54        alias: '维度组',
55        children: [
56          {
57            id: 'date',
58            alias: '日期',
59          },
60          {
61            id: 'type',
62            alias: '类型',
63          },
64        ],
65      },
66    ],
67  }
68  return <VTableTable vseed={vseed} />
69})