diff --git a/web/components/common.js b/web/components/common.js index b3d0360..4d0fc66 100644 --- a/web/components/common.js +++ b/web/components/common.js @@ -1,9 +1,27 @@ function timeAndFrom(field, fromNow, emptyText = '未停止', showSource = true) { - let tpl = "${" + fromNow + "}" + let tpl = "${IF(" + field + " === 0, '(" + emptyText + ")', CONCATENATE(''," + fromNow + ",''))}" if (showSource) { - tpl = tpl + "
${IF(" + field + " === 0, '(" + emptyText + ")', CONCATENATE('(',DATETOSTR(DATE(" + field + ")),')'))}" + return { + align: 'center', + width: 80, + type: 'tooltip-wrapper', + content: "${DATETOSTR(DATE(" + field + "))}", + inline: true, + className: 'mr-2', + disabledOn: `\${${field} === 0}`, + body: { + type: 'tpl', + tpl: tpl, + } + } + } else { + return { + align: 'center', + width: 140, + type: 'tpl', + tpl: "${DATETOSTR(DATE(" + field + "))}", + } } - return tpl } function applicationLogDialog() { @@ -70,6 +88,10 @@ function yarnQueueCrud(clusters = undefined, queueNames = undefined) { { name: 'queueName', label: '队列名称', + width: 130, + type: 'tooltip-wrapper', + body: '${TRUNCATE(queueName, 20)}', + content: '${queueName}', }, { label: '当前容量', @@ -91,7 +113,6 @@ function yarnQueueCrud(clusters = undefined, queueNames = undefined) { color: "#dc3545" } ], - width: 1300, }, { label: '进度', @@ -172,14 +193,16 @@ function yarnCrudColumns() { { name: 'name', label: '名称', - fixed: 'left', + className: 'nowrap', ...copyField('name') }, { name: 'cluster', label: '集群', - width: 50, + width: 65, align: 'center', + type: 'tpl', + tpl: '${cluster}' }, { label: '用户', @@ -192,19 +215,14 @@ function yarnCrudColumns() { { name: 'startedTime', label: '启动时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('startedTime', 'startTimeFromNow'), + ...timeAndFrom('startedTime', 'startTimeFromNow'), sortable: true, - align: 'center', canAccessSuperData: false, }, { name: 'finishedTime', label: '停止时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('finishedTime', 'finishTimeFromNow'), + ...timeAndFrom('finishedTime', 'finishTimeFromNow'), sortable: true, align: 'center', canAccessSuperData: false, @@ -498,7 +516,7 @@ function simpleYarnDialog(cluster, title, filterField) { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, } ], @@ -735,7 +753,7 @@ function tableMetaDialog() { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, }, ], @@ -743,7 +761,7 @@ function tableMetaDialog() { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, }, ], diff --git a/web/components/queue-tab.js b/web/components/queue-tab.js index 1fc566d..39cbf6c 100644 --- a/web/components/queue-tab.js +++ b/web/components/queue-tab.js @@ -21,7 +21,7 @@ function queueCrud(name) { { type: 'pagination', layout: ['pager'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, } ], @@ -72,7 +72,9 @@ function queueTab() { title: '压缩队列', tab: [ queueCrud('compaction-queue-pre'), + yarnQueueCrud('b1', 'datalake'), queueCrud('compaction-queue-b1'), + yarnQueueCrud('b5', 'ten_iap.datalake'), queueCrud('compaction-queue-b5'), ], } diff --git a/web/components/running-tab.js b/web/components/running-tab.js index 00f06f3..e632662 100644 --- a/web/components/running-tab.js +++ b/web/components/running-tab.js @@ -16,9 +16,7 @@ function runningTable(name) { { name: 'createTime', label: '创建时间', - type: 'tpl', - tpl: timeAndFrom('createTime', 'createTimeFromNow', undefined, false), - align: 'center', + ...timeAndFrom('createTime', 'createTimeFromNow', undefined, false), width: 70, }, ] diff --git a/web/components/table-tab.js b/web/components/table-tab.js index 95a5fd3..aa20d35 100644 --- a/web/components/table-tab.js +++ b/web/components/table-tab.js @@ -75,7 +75,7 @@ function tableTab() { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, }, ], @@ -83,7 +83,7 @@ function tableTab() { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, }, ], @@ -120,6 +120,7 @@ function tableTab() { type: 'wrapper', fixed: 'left', size: 'none', + className: 'nowrap', body: [ { type: 'action', @@ -156,46 +157,34 @@ function tableTab() { align: 'center', ...mappingField('syncRunning', tableRunningStateMapping), className: 'bg-green-50', - width: 140, + width: 75, }, { name: 'source_start_time', label: '同步启动时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.sourceStartTime', 'syncState.sourceStartTimeFromNow', '未启动'), + ...timeAndFrom('syncState.sourceStartTime', 'syncState.sourceStartTimeFromNow', '未启动'), sortable: true, - align: 'center', className: 'bg-green-50', }, { name: 'source_checkpoint_time', label: '同步心跳时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.sourceCheckpointTime', 'syncState.sourceCheckpointTimeFromNow', '未启动'), + ...timeAndFrom('syncState.sourceCheckpointTime', 'syncState.sourceCheckpointTimeFromNow', '未启动'), sortable: true, - align: 'center', className: 'bg-green-50', }, { name: 'source_publish_time', label: '源端发布时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.sourcePublishTime', 'syncState.sourcePublishTimeFromNow', '无增量'), + ...timeAndFrom('syncState.sourcePublishTime', 'syncState.sourcePublishTimeFromNow', '无增量'), sortable: true, - align: 'center', className: 'bg-green-50', }, { name: 'source_operation_time', label: '源端业务时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.sourceOperationTime', 'syncState.sourceOperationTimeFromNow', '无增量'), + ...timeAndFrom('syncState.sourceOperationTime', 'syncState.sourceOperationTimeFromNow', '无增量'), sortable: true, - align: 'center', className: 'bg-green-50', }, { @@ -204,7 +193,7 @@ function tableTab() { align: 'center', ...mappingField('compactionRunning', tableRunningStateMapping), className: 'bg-cyan-50', - width: 140, + width: 75, }, { name: 'compaction_status', @@ -226,21 +215,15 @@ function tableTab() { { name: 'compaction_start_time', label: '压缩启动时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.compactionStartTime', 'syncState.compactionStartTimeFromNow'), + ...timeAndFrom('syncState.compactionStartTime', 'syncState.compactionStartTimeFromNow'), sortable: true, - align: 'center', className: 'bg-cyan-50', }, { name: 'compaction_finish_time', label: '压缩完成时间', - width: 140, - type: 'tpl', - tpl: timeAndFrom('syncState.compactionFinishTime', 'syncState.compactionFinishTimeFromNow'), + ...timeAndFrom('syncState.compactionFinishTime', 'syncState.compactionFinishTimeFromNow'), sortable: true, - align: 'center', className: 'bg-cyan-50', }, ] diff --git a/web/components/yarn-tab.js b/web/components/yarn-tab.js index 5a97595..4164850 100644 --- a/web/components/yarn-tab.js +++ b/web/components/yarn-tab.js @@ -101,7 +101,7 @@ function yarnTab(cluster, title, queueNames = 'root', searchName = undefined) { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, } ], @@ -109,7 +109,7 @@ function yarnTab(cluster, title, queueNames = 'root', searchName = undefined) { { type: 'pagination', layout: ['pager', 'perPage'], - maxButtons: 8, + maxButtons: 5, showPageInput: false, } ],