feature(web): 增加时间线 Rollback 和 Clean 的查询

web/components/common.js

@@ -899,18 +899,160 @@ function timelineColumns() {
                         }
                     }
                 },
-                /*{
-                    type: 'tpl',
-                    tpl: '${hdfs}'
+                {
+                    visibleOn: "action === 'rollback'",
+                    type: 'action',
+                    icon: 'fa fa-eye',
+                    level: 'link',
+                    tooltip: '查看回滚计划',
+                    size: 'sm',
+                    actionType: 'dialog',
+                    dialog: {
+                        title: '回滚计划详情',
+                        actions: [],
+                        size: 'lg',
+                        body: {
+                            type: 'service',
+                            api: {
+                                method: 'get',
+                                url: '${base}/hudi/read_rollback_plan',
+                                data: {
+                                    hdfs: '${hdfs|default:undefined}',
+                                    flink_job_id: '${flinkJobId|default:undefined}',
+                                    alias: '${tableMeta.alias|default:undefined}',
+                                    instant: '${timestamp|default:undefined}',
+                                },
+                            },
+                            body: [
+                                {
+                                    type: 'property',
+                                    title: '回滚目标',
+                                    items: [
+                                        {
+                                            label: 'Action',
+                                            content: {
+                                                value: '${instantToRollback.action}',
+                                                ...mappingField('instantToRollback.action', hudiTimelineActionMapping)
+                                            },
+                                        },
+                                        {label: '时间点', content: '${instantToRollback.commitTime}', span: 2},
+                                    ],
+                                },
+                                {
+                                    type: 'crud',
+                                    source: '${rollbackRequests}',
+                                    ...crudCommonOptions(),
+                                    columns: [
+                                        {
+                                            name: 'fileId',
+                                            label: '文件 ID',
+                                            searchable: true,
+                                        },
+                                        {
+                                            name: 'partitionPath',
+                                            label: '分区',
+                                            width: 50,
+                                        },
+                                        {
+                                            name: 'latestBaseInstant',
+                                            label: '数据文件版本',
+                                        },
+                                    ]
+                                }
+                            ]
+                        }
+                    }
                 },
                 {
-                    type: 'tpl',
-                    tpl: '${flinkJobId}'
+                    visibleOn: "action === 'clean'",
+                    type: 'action',
+                    icon: 'fa fa-eye',
+                    level: 'link',
+                    tooltip: '查看清理计划',
+                    size: 'sm',
+                    actionType: 'dialog',
+                    dialog: {
+                        title: '清理计划详情',
+                        actions: [],
+                        size: 'lg',
+                        body: {
+                            type: 'service',
+                            api: {
+                                method: 'get',
+                                url: '${base}/hudi/read_cleaner_plan',
+                                data: {
+                                    hdfs: '${hdfs|default:undefined}',
+                                    flink_job_id: '${flinkJobId|default:undefined}',
+                                    alias: '${tableMeta.alias|default:undefined}',
+                                    instant: '${timestamp|default:undefined}',
+                                },
+                                adaptor: (payload, response) => {
+                                    if (payload.data['filePathsToBeDeletedPerPartition']) {
+                                        let map = payload.data['filePathsToBeDeletedPerPartition']
+                                        let list = []
+                                        Object.keys(map)
+                                            .forEach(key => {
+                                                list.push({
+                                                    partitionPath: key,
+                                                    files: map[key],
+                                                })
+                                            })
+                                        payload.data['filePathsToBeDeletedPerPartition'] = list
+                                    }
+                                    return payload
+                                }
+                            },
+                            body: [
+                                {
+                                    type: 'property',
+                                    title: '最早回滚时间点',
+                                    items: [
+                                        {label: '策略', content: '${policy}', span: 3},
+                                        {
+                                            label: '操作',
+                                            content: {
+                                                value: '${earliestInstantToRetain.action}',
+                                                ...mappingField('earliestInstantToRetain.action', hudiTimelineActionMapping)
+                                            },
+                                        },
+                                        {
+                                            label: '状态',
+                                            content: {
+                                                value: '${earliestInstantToRetain.state}',
+                                                ...mappingField('earliestInstantToRetain.state', hudiTimelineStateMapping)
+                                            },
+                                        },
+                                        {label: '时间点', content: '${earliestInstantToRetain.timestamp}'},
+                                    ],
+                                },
+                                {
+                                    type: 'crud',
+                                    source: '${filePathsToBeDeletedPerPartition}',
+                                    ...crudCommonOptions(),
+                                    loadDataOnce: true,
+                                    title: '分区删除文件',
+                                    columns: [
+                                        {
+                                            name: 'partitionPath',
+                                            label: '分区',
+                                            width: 50,
+                                            align: 'center',
+                                        },
+                                        {
+                                            name: 'files',
+                                            label: '清理文件',
+                                            type: 'list',
+                                            className: 'nowrap',
+                                            listItem: {
+                                                body: '${filePath}',
+                                            }
+                                        }
+                                    ]
+                                }
+                            ]
+                        }
+                    }
                 },
-                {
-                    type: 'tpl',
-                    tpl: '${tableMeta.alias}'
-                },*/
             ]
         },
         {