Skip to content

Commit

Permalink
fix(frontend): 权限查询页查询条件手输无法查询 #8207
Browse files Browse the repository at this point in the history
  • Loading branch information
3octaves authored and jinquantianxia committed Dec 2, 2024
1 parent b659a60 commit 6d77842
Show file tree
Hide file tree
Showing 5 changed files with 212 additions and 51 deletions.
2 changes: 1 addition & 1 deletion dbm-ui/frontend/src/services/source/dbbase.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export function verifyDuplicatedClusterName(params: { cluster_type: string; name
}

/**
* 根据过滤条件查询集群详细信息
* 根据过滤条件查询集群详细信息,返回的字段和集群列表接口相同
*/
export function filterClusters<
T extends {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,20 +17,25 @@
ref="formRef"
form-type="vertical"
:model="formData">
<IpItem v-model="formData.ips" />
<IpItem
v-model="formData.ips"
@change="getUserList" />
<DomainItem
ref="domainItemRef"
v-model="formData.immute_domains"
v-model:cluster-type="formData.cluster_type"
v-model:is-master="formData.is_master"
:account-type="accountType" />
:account-type="accountType"
@change="getUserList" />
<BkFormItem
:label="t('账号')"
property="users"
required>
<UserSelect
ref="userSelectRef"
v-model="formData.users"
:form-data="formData" />
:form-data="formData"
:validate-func="userSelectValidateFunc" />
</BkFormItem>
<BkFormItem
:label="t('访问 DB')"
Expand Down Expand Up @@ -110,6 +115,7 @@

const formRef = ref<InstanceType<typeof Form>>();
const domainItemRef = ref<InstanceType<typeof DomainItem>>();
const userSelectRef = ref<InstanceType<typeof UserSelect>>();

const formData = reactive(getDefaultFormData());

Expand All @@ -134,6 +140,16 @@
formRef.value!.clearValidate();
});
};

const userSelectValidateFunc = () =>
formRef
.value!.validate(['ips', 'immute_domains'])
.then(() => true)
.catch(() => false);

const getUserList = () => {
userSelectRef.value!.getUserList();
};
</script>

<style lang="less">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@
import TendbhaModel from '@services/model/mysql/tendbha';
import TendbsingleModel from '@services/model/mysql/tendbsingle';
import SpiderModel from '@services/model/tendbcluster/tendbcluster';
import { filterClusters } from '@services/source/dbbase';
import { getTendbhaList, getTendbhaSalveList } from '@services/source/tendbha';
import { AccountTypes, ClusterTypes } from '@common/const';
Expand All @@ -62,13 +63,16 @@
accountType: AccountTypes;
}
interface Emits {
(e: 'change'): void;
}
interface Expose {
reset: () => void;
}
const props = defineProps<Props>();
const { t } = useI18n();
const emits = defineEmits<Emits>();
const modelValue = defineModel<string>({
required: true,
Expand All @@ -80,6 +84,8 @@
required: true,
});
const { t } = useI18n();
const getDefaultSelectedClusters = () =>
accoutMap[props.accountType as keyof typeof accoutMap].clusterSelectorTypes.reduce(
(prevMap, type) => Object.assign({}, prevMap, { [type]: [] }),
Expand Down Expand Up @@ -147,15 +153,107 @@
const clusterList = Object.values(selected).find((clusterList) => clusterList.length > 0);
clusterType.value = (clusterList?.[0].cluster_type || ClusterTypes.TENDBSINGLE) as ClusterTypes;
isMaster.value = !selectedClusters.value?.tendbhaSlave?.length;
emits('change');
};
const getDomainDiffInfo = (
oldDomains: string[],
newDomains: string[],
): {
added?: string[];
deleted?: string[];
unchanged?: string[];
} => {
// 使用 Set 提高性能
const oldSet = new Set(oldDomains);
const newSet = new Set(newDomains);
// 初始化结果数组
const result: { domain: string; status: 'added' | 'deleted' | 'unchanged' }[] = [];
// 遍历新域名集合,检查每个域名的状态
for (const domain of newSet) {
if (oldSet.has(domain)) {
result.push({ domain, status: 'unchanged' });
} else {
result.push({ domain, status: 'added' });
}
}
// 遍历旧域名集合,检查每个域名的状态
for (const domain of oldSet) {
if (!newSet.has(domain)) {
result.push({ domain, status: 'deleted' });
}
}
// 按状态分类结果
const classifiedResult = result.reduce<Record<string, string[]>>((acc, item) => {
if (!acc[item.status]) {
acc[item.status] = [];
}
acc[item.status].push(item.domain);
return acc;
}, {});
// 输出分类结果
return classifiedResult;
};
const handleDomainChange = (value: string) => {
// 减少或增加,需要与选择器联动
const newDomainList = value.split(batchSplitRegex).filter((item) => item);
const domainSet = new Set(newDomainList);
Object.keys(selectedClusters.value).forEach((key) => {
const clusterList = selectedClusters.value[key];
selectedClusters.value[key] = clusterList.filter((clusterItem) => domainSet.has(clusterItem.master_domain));
});
const newValidDomainList = newDomainList.filter((item) => domainRegex.test(item));
const selectDomainList = Object.values(selectedClusters.value).flatMap((item) => item);
const diffResult = getDomainDiffInfo(
selectDomainList.map((item) => item.master_domain),
newValidDomainList,
);
const addList = diffResult.added || [];
const deleteList = diffResult.deleted || [];
const deleteSet = new Set(deleteList);
if (addList.length) {
filterClusters({
bk_biz_id: window.PROJECT_CONFIG.BIZ_ID,
exact_domain: addList.join(','),
}).then((clusterResultList) => {
// 删除时,删去已选集群
deleteSelectedCluster(deleteSet);
// 新增时,查询集群信息,同步已选集群
const selected = selectedClusters.value;
clusterResultList.forEach((clusterItem) => {
selected[clusterItem.cluster_type] = selected[clusterItem.cluster_type].concat(clusterItem);
});
selectedClusters.value = selected;
const clusterList = Object.values(selected).find((clusterList) => clusterList.length > 0);
clusterType.value = (clusterList?.[0].cluster_type || ClusterTypes.TENDBSINGLE) as ClusterTypes;
isMaster.value = !selectedClusters.value?.tendbhaSlave?.length;
nextTick(() => {
emits('change');
});
});
} else {
// 删除时,删去已选集群
deleteSelectedCluster(deleteSet);
emits('change');
}
};
const deleteSelectedCluster = (deleteSet: Set<string>) => {
if (deleteSet.size) {
Object.keys(selectedClusters.value).forEach((key) => {
const clusterList = selectedClusters.value[key];
selectedClusters.value[key] = clusterList.filter((clusterItem) => !deleteSet.has(clusterItem.master_domain));
});
}
};
defineExpose<Expose>({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
v-model="modelValue"
icon-type="batch-host-select"
:max-count="50"
@change="handleChange"
@icon-click="() => (hostSelectorShow = true)" />
</BkFormItem>
<IpSelector
Expand Down Expand Up @@ -54,12 +55,17 @@
import BatchInput from './components/BatchInput.vue';
const { t } = useI18n();
interface Emits {
(e: 'change'): void;
}
const emits = defineEmits<Emits>();
const modelValue = defineModel<string>({
required: true,
});
const { t } = useI18n();
const bizId = window.PROJECT_CONFIG.BIZ_ID;
const rules = [
Expand Down Expand Up @@ -89,6 +95,10 @@
const disableHostSubmitMethod = (hostList: HostInfo[]) => (hostList.length <= 50 ? false : t('至多n台', { n: 50 }));
const handleChange = () => {
emits('change');
};
const handleChangeIP = (data: HostInfo[]) => {
selectedHosts.value = data;
modelValue.value = data.map((item) => item.ip).join(' | ');
Expand All @@ -100,6 +110,7 @@
const ipList = data.flatMap((item) => item.ips).map((ip) => ip);
const prevIpList = modelValue.value ? modelValue.value.split(' | ') : [];
modelValue.value = [...prevIpList, ...ipList].map((item) => item).join(' | ');
emits('change');
});
};
</script>
Loading

0 comments on commit 6d77842

Please sign in to comment.