Skip to content

Commit

Permalink
fix(frontend): 大数据节点列表筛选后勾选提示异常问题修复 #6963
Browse files Browse the repository at this point in the history
# Reviewed, transaction id: 18794
  • Loading branch information
jinquantianxia committed Sep 19, 2024
1 parent 30db6a8 commit a03e992
Show file tree
Hide file tree
Showing 7 changed files with 71 additions and 43 deletions.
46 changes: 25 additions & 21 deletions dbm-ui/frontend/src/components/db-textarea/DbTextarea.vue
Original file line number Diff line number Diff line change
Expand Up @@ -61,18 +61,18 @@
import { encodeMult } from '@utils';

interface Props {
displayHeight?: number | string
maxHeight?: number,
teleportToBody?: boolean,
rowHeight?: number,
displayHeight?: number | string;
maxHeight?: number;
teleportToBody?: boolean;
rowHeight?: number;
}

interface Emits {
(e: 'focus', value: FocusEvent): void
(e: 'blur', value: FocusEvent): void
(e: 'change', value: string): void
(e: 'input', value: string): void
(e: 'clear'): void
(e: 'focus', value: FocusEvent): void;
(e: 'blur', value: FocusEvent): void;
(e: 'change', value: string): void;
(e: 'input', value: string): void;
(e: 'clear'): void;
}

const props = withDefaults(defineProps<Props>(), {
Expand Down Expand Up @@ -104,14 +104,20 @@
const rows = ref(1);
// const height = computed(() => rows.value * rowHeight);
// bk textarea style
const style = computed(() => Object.assign({ maxHeight: `${props.maxHeight}px`, '--row-height': `${props.rowHeight}px` }, attrs.style || {}));
const style = computed(() =>
Object.assign({ maxHeight: `${props.maxHeight}px`, '--row-height': `${props.rowHeight}px` }, attrs.style || {}),
);
const renderValues = computed(() => modelValue.value.split('\n').join(', '));
const placeholder = computed(() => {
if (renderValues.value) return '';
if (renderValues.value) {
return '';
}

return (attrs.placeholder || t('请输入')) as string;
});
const displayHeightValue = computed(() => (typeof props.displayHeight === 'string' ? props.displayHeight : `${props.displayHeight}px`));
const displayHeightValue = computed(() =>
typeof props.displayHeight === 'string' ? props.displayHeight : `${props.displayHeight}px`,
);

// 初始化 rows
if (typeof props.displayHeight === 'number') {
Expand All @@ -125,11 +131,7 @@
const handleEdit = () => {
// 为了解决第一次用 getBoundingClientRect 获取信息不准确问题
if (dbTextareaRef.value) {
const {
x,
y,
width,
} = dbTextareaRef.value.getBoundingClientRect();
const { x, y, width } = dbTextareaRef.value.getBoundingClientRect();
inputPosition.x = x;
inputPosition.y = y;
inputPosition.width = width;
Expand All @@ -147,7 +149,8 @@

if (textareaRef.value?.$el) {
const el = textareaRef.value.$el as HTMLDivElement;
const minHeight = typeof props.displayHeight === 'number' ? Math.max(props.displayHeight, props.rowHeight) : props.rowHeight;
const minHeight =
typeof props.displayHeight === 'number' ? Math.max(props.displayHeight, props.rowHeight) : props.rowHeight;
const height = Math.max(rows.value * props.rowHeight + textareaPadding, minHeight);
el.style.height = `${height}px`;
}
Expand Down Expand Up @@ -214,11 +217,12 @@
textareaRef.value?.focus?.();
};

const handlePaste = (value: string, event: ClipboardEvent) => {
const handlePaste = (value: string, event: any) => {
const cursorPosition = event.target.selectionStart;
event.preventDefault();
let paste = (event.clipboardData || window.clipboardData).getData('text');
paste = encodeMult(paste);
modelValue.value = paste.replace(/^\s+|\s+$/g, '');
paste = encodeMult(paste).replace(/^\s+|\s+$/g, '');
modelValue.value = modelValue.value.slice(0, cursorPosition) + paste + modelValue.value.slice(cursorPosition);
};

defineExpose({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,7 @@
let clientNodeNum = 0;
let hotNodeNum = 0;
let coldNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (nodeItem.isClient) {
clientNodeNum = clientNodeNum + 1;
} else if (nodeItem.isHot) {
Expand Down Expand Up @@ -284,6 +284,8 @@
}
});

let totalTableData: EsNodeModel[] = [];

const isAnomalies = ref(false);
const isShowReplace = ref(false);
const isShowExpandsion = ref(false);
Expand Down Expand Up @@ -339,7 +341,7 @@
let hotNodeNum = 0;
let coldNodeNumTotal = 0;
let coldNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (nodeItem.isHot) {
hotNodeNumTotal = hotNodeNumTotal + 1;
} else if (nodeItem.isCold) {
Expand Down Expand Up @@ -563,6 +565,9 @@
}).then((data) => {
tableData.value = data.results;
isAnomalies.value = false;
if (searchValue.value.length === 0) {
totalTableData = _.cloneDeep(tableData.value);
}
})
.catch(() => {
tableData.value = [];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -224,7 +224,7 @@
} else {
// 其它类型的节点数不能全部被缩容,至少保留一个
let dataNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (nodeItem.isDataNode) {
dataNodeNum = dataNodeNum + 1;
}
Expand Down Expand Up @@ -262,6 +262,8 @@
}
});

let totalTableData: HdfsNodeModel[] = [];

const isLoading = ref(false);
const isAnomalies = ref(false);
const isShowReplace = ref(false);
Expand Down Expand Up @@ -304,7 +306,7 @@

// 其它类型的节点数不能全部被缩容,至少保留一个
let dataNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (checkedNodeMap.value[nodeItem.bk_host_id]) {
return;
}
Expand Down Expand Up @@ -551,6 +553,9 @@
}).then((data) => {
tableData.value = data.results;
isAnomalies.value = false;
if (searchValue.value.length === 0) {
totalTableData = _.cloneDeep(tableData.value);
}
})
.catch(() => {
tableData.value = [];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -232,7 +232,7 @@
} else {
// 其它类型的节点数不能全部被缩容,至少保留一个
let brokerNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (nodeItem.isBroker) {
brokerNum = brokerNum + 1;
}
Expand Down Expand Up @@ -271,6 +271,8 @@
}
});

let totalTableData: KafkaNodeModel[] = [];

const isAnomalies = ref(false);
const isShowReplace = ref(false);
const isShowExpandsion = ref(false);
Expand Down Expand Up @@ -310,7 +312,7 @@
return options;
}
let brokerNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (checkedNodeMap.value[nodeItem.bk_host_id]) {
return;
}
Expand Down Expand Up @@ -514,6 +516,9 @@
}).then((data) => {
tableData.value = data.results;
isAnomalies.value = false;
if (searchValue.value.length === 0) {
totalTableData = _.cloneDeep(tableData.value);
}
})
.catch(() => {
tableData.value = [];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -230,7 +230,7 @@
// 其它类型的节点数不能全部被缩容,至少保留一个
let bookkeeperNodeNum = 0;
let brokerNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (nodeItem.isBookkeeper) {
bookkeeperNodeNum = bookkeeperNodeNum + 1;
} else if (nodeItem.isBroker) {
Expand Down Expand Up @@ -266,7 +266,7 @@
validateSearchValues,
handleSearchValueChange,
} = useLinkQueryColumnSerach({
searchType: ClusterTypes.PULSAE,
searchType: ClusterTypes.PULSAR,
attrs: ['bk_cloud_id'],
fetchDataFn: () => fetchNodeList(),
defaultSearchItem: {
Expand All @@ -275,6 +275,8 @@
}
});

let totalTableData: PulsarNodeModel[] = [];

const isAnomalies = ref(false);
const isShowReplace = ref(false);
const isShowExpandsion = ref(false);
Expand Down Expand Up @@ -320,7 +322,7 @@
// 其它类型的节点数不能全部被缩容,至少保留一个
let bookkeeperNodeNum = 0;
let brokerNodeNum = 0;
tableData.value.forEach((nodeItem) => {
totalTableData.forEach((nodeItem) => {
if (checkedNodeMap.value[nodeItem.bk_host_id]) {
return;
}
Expand Down Expand Up @@ -529,6 +531,9 @@
}).then((data) => {
tableData.value = data.results;
isAnomalies.value = false;
if (searchValue.value.length === 0) {
totalTableData = _.cloneDeep(tableData.value);
}
})
.catch(() => {
tableData.value = [];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -494,8 +494,8 @@

.delete-confirm {
padding: 0 36px;
text-align: left;
font-size: 14px;
text-align: left;

.delete-confirm-item {
padding-bottom: 4px;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,55 +45,59 @@
</BkButton>
<template #content>
<BkDropdownMenu>
<BkDropdownItem v-db-console="'redis.clusterManage.extractKey'">
<BkDropdownItem
v-db-console="'redis.clusterManage.extractKey'"
@click="handleShowExtract(selected)">
<BkButton
v-bk-tooltips="{
disabled: !hasDisabledRow,
content: t('禁用的集群不支持提取 Key'),
placement: 'right',
}"
:disabled="hasDisabledRow"
text
@click="handleShowExtract(selected)">
text>
{{ t('提取Key') }}
</BkButton>
</BkDropdownItem>
<BkDropdownItem v-db-console="'redis.clusterManage.deleteKey'">
<BkDropdownItem
v-db-console="'redis.clusterManage.deleteKey'"
@click="handlShowDeleteKeys(selected)">
<BkButton
v-bk-tooltips="{
disabled: !hasDisabledRow,
content: t('禁用的集群不支持删除 Key'),
placement: 'right',
}"
:disabled="hasDisabledRow"
text
@click="handlShowDeleteKeys(selected)">
text>
{{ t('删除Key') }}
</BkButton>
</BkDropdownItem>
<BkDropdownItem v-db-console="'redis.clusterManage.backup'">
<BkDropdownItem
v-db-console="'redis.clusterManage.backup'"
@click="handleShowBackup(selected)">
<BkButton
v-bk-tooltips="{
disabled: !hasDisabledRow,
content: t('禁用的集群不支持备份'),
placement: 'right',
}"
:disabled="hasDisabledRow"
text
@click="handleShowBackup(selected)">
text>
{{ t('备份') }}
</BkButton>
</BkDropdownItem>
<BkDropdownItem v-db-console="'redis.clusterManage.dbClear'">
<BkDropdownItem
v-db-console="'redis.clusterManage.dbClear'"
@click="handleShowPurge(selected)">
<BkButton
v-bk-tooltips="{
disabled: !hasDisabledRow,
content: t('禁用的集群不支持清档'),
placement: 'right',
}"
:disabled="hasDisabledRow"
text
@click="handleShowPurge(selected)">
text>
{{ t('清档') }}
</BkButton>
</BkDropdownItem>
Expand Down

0 comments on commit a03e992

Please sign in to comment.