Skip to content

Commit

Permalink
feat(frontend): 单据管理迭代_123 TencentBlueKing#7190
Browse files Browse the repository at this point in the history
  • Loading branch information
hLinx committed Dec 7, 2024
1 parent 4ed9205 commit b605557
Show file tree
Hide file tree
Showing 9 changed files with 80 additions and 118 deletions.
10 changes: 9 additions & 1 deletion dbm-ui/frontend/src/locales/zh-cn.json
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
"备份目标": "备份目标",
"备份类型": "备份类型",
"备注": "备注",
"备注": "备注",
"备注:": "备注:",
"大小": "大小",
"大数据": "大数据",
"字符集": "字符集",
Expand Down Expand Up @@ -3802,5 +3802,13 @@
"构造类型:": "构造类型:",
"备份记录:": "备份记录:",
"新客户端 IP": "新客户端 IP",
"全局超时时间(h):": "全局超时时间(h):",
"修复数据:": "修复数据:",
"修复模式:": "修复模式:",
"主库主机关联实例": "主库主机关联实例",
"数据校验:": "数据校验:",
"校验时间:": "校验时间:",
"定时执行时间:": "定时执行时间:",
"忽略业务连接:": "忽略业务连接:",
"这行勿动!新增翻译请在上一行添加!": ""
}
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export interface SpiderReduceNodes extends DetailBase {
cluster_id: number;
reduce_spider_role: string;
spider_reduced_to_count: number;
spider_reduced_hosts: {
spider_reduced_hosts?: {
ip: string;
bk_host_id: number;
bk_cloud_id: number;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
class="ticket-details-page"
:data="data" />
<InfoList>
<Item :label="t('备注')">
<Item :label="t('备注:')">
{{ data.remark || '--' }}
</Item>
</InfoList>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@
:key="item">
{{ item }}
</BkTag>
<span v-if="data.db_patterns.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('忽略 DB 名')">
Expand All @@ -46,6 +47,7 @@
:key="item">
{{ item }}
</BkTag>
<span v-if="data.ignore_dbs.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('指定表名')">
Expand All @@ -55,6 +57,7 @@
:key="item">
{{ item }}
</BkTag>
<span v-if="data.table_patterns.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('忽略表名')">
Expand All @@ -64,6 +67,7 @@
:key="item">
{{ item }}
</BkTag>
<span v-if="data.ignore_tables.length < 1">--</span>
</template>
</BkTableColumn>
</BkTable>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
defineProps<Props>();
</script>
<style lang="less">
@label-width: 100px;
@label-width: 150px;
.db-ticket-info-item {
flex: 0 0 50%;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,24 +12,27 @@
-->

<template>
<BkTable
:data="ticketDetails.details.infos"
show-overflow-tooltip>
<BkTable :data="ticketDetails.details.infos">
<BkTableColumn
fixed="left"
:label="t('源集群')"
:min-width="180">
:min-width="220"
:show-overflow="false">
<template #default="{ data }: { data: RowData }">
{{ ticketDetails.details.clusters[data.cluster_id].immute_domain }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('架构版本')">
<BkTableColumn
:label="t('架构版本')"
:min-width="180">
<template #default="{ data }: { data: RowData }">
{{ ticketDetails.details.clusters[data.cluster_id].cluster_type_name }}
</template>
</BkTableColumn>
<BkTableColumn
field="db_version"
:label="t('Redis版本')">
:label="t('Redis版本')"
:min-width="100">
</BkTableColumn>
<BkTableColumn
:label="t('当前容量')"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,14 +51,14 @@
:label="t('校验从库')"
:width="220">
<template #default="{ data }: { data: RowData }">
{{ data.slave }}
{{ data.slave || '--' }}
</template>
</BkTableColumn>
<BkTableColumn
:label="t('校验主库')"
:width="220">
<template #default="{ data }: { data: RowData }">
{{ data.slave }}
{{ data.master || '--' }}
</template>
</BkTableColumn>
<BkTableColumn
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,25 +12,32 @@
-->

<template>
<BkTable
:data="ticketDetails.details.infos"
show-overflow-tooltip>
<BkTableColumn :label="t('目标集群')">
<BkTable :data="ticketDetails.details.infos">
<BkTableColumn
fixed="left"
:label="t('目标集群')"
:min-width="220">
<template #default="{ data }: { data: RowData }">
{{ ticketDetails.details.clusters[data.cluster_id].immute_domain }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('回档时间')">
<BkTableColumn
:label="t('回档时间')"
:min-width="250">
<template #default="{ data }: { data: RowData }">
{{ utcDisplayTime(data.start_time) }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('截止时间')">
<BkTableColumn
:label="t('截止时间')"
:min-width="250">
<template #default="{ data }: { data: RowData }">
{{ utcDisplayTime(data.end_time) }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('目标库')">
<BkTableColumn
:label="t('目标库')"
:min-width="120">
<template #default="{ data }: { data: RowData }">
<BkTag
v-for="item in data.databases"
Expand All @@ -40,7 +47,9 @@
<span v-if="data.databases.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('目标表')">
<BkTableColumn
:label="t('目标表')"
:min-width="120">
<template #default="{ data }: { data: RowData }">
<BkTag
v-for="item in data.tables"
Expand All @@ -50,7 +59,9 @@
<span v-if="data.tables.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('忽略库')">
<BkTableColumn
:label="t('忽略库')"
:min-width="120">
<template #default="{ data }: { data: RowData }">
<BkTag
v-for="item in data.databases_ignore"
Expand All @@ -60,7 +71,9 @@
<span v-if="data.databases_ignore.length < 1">--</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('忽略表')">
<BkTableColumn
:label="t('忽略表')"
:min-width="120">
<template #default="{ data }: { data: RowData }">
<BkTag
v-for="item in data.tables_ignore"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,47 +12,48 @@
-->

<template>
<BkLoading :loading="loading">
<BkTable :data="tableData">
<BkTableColumn :label="t('目标集群')">
<template #default="{ data }: { data: RowData }">
{{ data.clusterName }}
<BkTable :data="ticketDetails.details.infos">
<BkTableColumn :label="t('目标集群')">
<template #default="{ data }: { data: RowData }">
{{ ticketDetails.details.clusters[data.cluster_id].immute_domain }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('缩容节点类型')">
<template #default="{ data }: { data: RowData }">
{{ data.reduce_spider_role === 'spider_master' ? 'Master' : 'Slave' }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('主机选择方式')">
<template #default="{ data }: { data: RowData }">
<template v-if="data.spider_reduced_hosts">
<div
v-for="item in data.spider_reduced_hosts"
:key="item.bk_host_id">
{{ item.ip }}
</div>
</template>
</BkTableColumn>
<BkTableColumn :label="t('缩容节点类型')">
<template #default="{ data }: { data: RowData }">
{{ data.nodeType }}
</template>
</BkTableColumn>
<BkTableColumn :label="t('主机选择方式')">
<template #default="{ data }: { data: RowData }">
<div style="line-height: 18px; white-space: break-spaces">{{ data.hostSelectType }}</div>
</template>
</BkTableColumn>
<BkTableColumn :label="t('缩容数量(台)')">
<template #default="{ data }: { data: RowData }">
{{ data.targetNum }}
</template>
</BkTableColumn>
</BkTable>
</BkLoading>
<span v-else>{{ t('自动匹配') }}</span>
</template>
</BkTableColumn>
<BkTableColumn :label="t('缩容数量(台)')">
<template #default="{ data }: { data: RowData }">
{{ data.spider_reduced_hosts ? data.spider_reduced_hosts.length : data.spider_reduced_to_count }}
</template>
</BkTableColumn>
</BkTable>
</template>
<script setup lang="ts">
import { useI18n } from 'vue-i18n';
import { useRequest } from 'vue-request';

import ResourceSpecModel from '@services/model/resource-spec/resourceSpec';
import TicketModel, { type TendbCluster } from '@services/model/ticket/ticket';
import { getResourceSpecList } from '@services/source/dbresourceSpec';
import { getTendbclusterListByBizId } from '@services/source/tendbcluster';

import { TicketTypes } from '@common/const';

interface Props {
ticketDetails: TicketModel<TendbCluster.SpiderReduceNodes>;
}

const props = defineProps<Props>();
defineProps<Props>();

defineOptions({
name: TicketTypes.TENDBCLUSTER_SPIDER_REDUCE_NODES,
Expand All @@ -61,72 +62,5 @@

const { t } = useI18n();

const { infos } = props.ticketDetails.details;

interface RowData {
clusterName: string;
clusterType: string;
nodeType: string;
sepcName: string;
hostSelectType: string;
targetNum: number;
}
const tableData = ref<RowData[]>([]);

const { loading } = useRequest(getTendbclusterListByBizId, {
defaultParams: [
{
bk_biz_id: props.ticketDetails.bk_biz_id,
offset: 0,
limit: -1,
},
],
onSuccess: async (r) => {
if (r.results.length < 1) {
return;
}
const clusterMap = r.results.reduce(
(obj, item) => {
Object.assign(obj, {
[item.id]: {
clusterName: item.master_domain,
clusterType: item.cluster_spec.spec_cluster_type,
specId: item.cluster_spec.spec_id,
},
});
return obj;
},
{} as Record<number, { clusterName: string; clusterType: string; specId: number }>,
);

// 避免重复查询
const clusterTypes = [...new Set(Object.values(clusterMap).map((item) => item.clusterType))];
const sepcMap: Record<string, ResourceSpecModel[]> = {};

await Promise.all(
clusterTypes.map(async (type) => {
const ret = await getResourceSpecList({
spec_cluster_type: type,
limit: -1,
offset: 0,
});
sepcMap[type] = ret.results;
}),
);
loading.value = false;
tableData.value = infos.map((item) => {
const sepcList = sepcMap[clusterMap[item?.cluster_id]?.clusterType] || [];
const specInfo = sepcList.find((row) => row.spec_id === clusterMap[item.cluster_id].specId);
const ipList = (item.spider_reduced_hosts || []).map((item) => item.ip);
return {
clusterName: clusterMap[item?.cluster_id]?.clusterName,
clusterType: clusterMap[item?.cluster_id]?.clusterType,
nodeType: item.reduce_spider_role === 'spider_master' ? 'Master' : 'Slave',
sepcName: specInfo ? specInfo.spec_name : '',
hostSelectType: ipList.length > 0 ? ipList.join('\n') : t('自动匹配'),
targetNum: item.spider_reduced_to_count || ipList.length,
};
});
},
});
type RowData = Props['ticketDetails']['details']['infos'][number];
</script>

0 comments on commit b605557

Please sign in to comment.