Skip to content

Commit

Permalink
fix: disable synchronization button in data source synchronization (#…
Browse files Browse the repository at this point in the history
  • Loading branch information
JoJohw authored Dec 10, 2024
1 parent 9042122 commit aadd809
Show file tree
Hide file tree
Showing 2 changed files with 124 additions and 54 deletions.
9 changes: 6 additions & 3 deletions src/pages/src/views/setting/data-source/ConfigList.vue
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
hover-theme="primary"
:loading="resetLoading"
@click="handleReset"
:disabled="RUNNING_FIELDS.includes(syncStatus?.status)"
:disabled="disabledSyncBtn"
>
{{ $t('重置') }}
</bk-button>
Expand All @@ -34,15 +34,15 @@
<div class="flex items-center">
<div class="mr-[40px]" v-if="syncStatus">
<span
v-if="!RUNNING_FIELDS.includes(syncStatus?.status)"
v-if="!disabledSyncBtn"
:class="['tag-style', dataRecordStatus[syncStatus?.status]?.theme]">
{{ dataRecordStatus[syncStatus?.status]?.text }}
</span>
<span v-else class="flex">
<img :src="dataRecordStatus[syncStatus?.status]?.icon" class="h-[19.25px] w-[19.25px] mr-[9.37px]" />
<span>{{ dataRecordStatus[syncStatus?.status]?.text }}</span>
</span>
<span v-if="!RUNNING_FIELDS.includes(syncStatus?.status)">
<span v-if="!disabledSyncBtn">
{{ syncStatus?.start_at }}
</span>
</div>
Expand All @@ -51,6 +51,7 @@
class="min-w-[64px]"
theme="primary"
@click="handleImport"
:disabled="disabledSyncBtn || resetLoading"
>
<Upload class="mr-[8px] text-[16px]" />
{{ $t('导入') }}
Expand All @@ -68,6 +69,7 @@
class="min-w-[64px]"
theme="primary"
@click.stop
:disabled="disabledSyncBtn"
>
{{ $t('同步') }}
</bk-button>
Expand Down Expand Up @@ -214,6 +216,7 @@ const route = useRoute();
const userStore = useUser();
const syncStatusStore = useSyncStatus();
const syncStatus = computed(() => syncStatusStore.syncStatus);
const disabledSyncBtn = computed(() => RUNNING_FIELDS.includes(syncStatus.value?.status));
const {
dataSourcePlugins,
dataSource,
Expand Down
169 changes: 118 additions & 51 deletions src/pages/src/views/setting/data-source/HttpDetails.vue
Original file line number Diff line number Diff line change
@@ -1,62 +1,116 @@
<template>
<bk-loading :loading="isLoading" class="details-info-wrapper user-scroll-y">
<div v-if="isPluginConfig">
<Row :title="$t('服务配置')">
<div class="flex">
<div class="flex-1">
<LabelContent :label="$t('服务地址')">{{ serverConfig.server_base_url }}</LabelContent>
<LabelContent :label="$t('用户数据 API 路径')">{{ serverConfig.user_api_path }}</LabelContent>
<div class="query-params" v-if="serverConfig.user_api_query_params?.length">
<span class="key">{{ $t('查询参数') }}:</span>
<div class="value">
<bk-tag v-for="(item, index) in serverConfig.user_api_query_params" :key="index">
{{item.key}}:{{item.value}}
</bk-tag>
<div v-if="pluginId !== 'ldap'">
<Row :title="$t('服务配置')">
<div class="flex">
<div class="flex-1">
<LabelContent :label="$t('服务地址')">{{ serverConfig.server_base_url }}</LabelContent>
<LabelContent :label="$t('用户数据 API 路径')">{{ serverConfig.user_api_path }}</LabelContent>
<div class="query-params" v-if="serverConfig.user_api_query_params?.length">
<span class="key">{{ $t('查询参数') }}:</span>
<div class="value">
<bk-tag v-for="(item, index) in serverConfig.user_api_query_params" :key="index">
{{item.key}}:{{item.value}}
</bk-tag>
</div>
</div>
</div>
<LabelContent :label="$t('组织数据 API 路径')">{{ serverConfig.department_api_path }}</LabelContent>
<div class="query-params" v-if="serverConfig.department_api_query_params?.length">
<span class="key">{{ $t('查询参数') }}:</span>
<div class="value">
<bk-tag v-for="(item, index) in serverConfig.department_api_query_params" :key="index">
{{item.key}}:{{item.value}}
</bk-tag>
<LabelContent :label="$t('组织数据 API 路径')">{{ serverConfig.department_api_path }}</LabelContent>
<div class="query-params" v-if="serverConfig.department_api_query_params?.length">
<span class="key">{{ $t('查询参数') }}:</span>
<div class="value">
<bk-tag v-for="(item, index) in serverConfig.department_api_query_params" :key="index">
{{item.key}}:{{item.value}}
</bk-tag>
</div>
</div>
</div>
<div class="flex-1">
<LabelContent :label="$t('分页请求每页数量')">{{ serverConfig.request_timeout }}</LabelContent>
<LabelContent :label="$t('请求超时时间')">{{ serverConfig.request_timeout }}{{ $t('秒') }}</LabelContent>
<LabelContent :label="$t('重试次数')">{{ serverConfig.retries }}{{ $t('次') }}</LabelContent>
</div>
</div>
<div class="flex-1">
<LabelContent :label="$t('分页请求每页数量')">{{ serverConfig.request_timeout }}</LabelContent>
<LabelContent :label="$t('请求超时时间')">{{ serverConfig.request_timeout }}{{ $t('秒') }}</LabelContent>
<LabelContent :label="$t('重试次数')">{{ serverConfig.retries }}{{ $t('次') }}</LabelContent>
</div>
</div>
</Row>
<Row :title="$t('认证配置')">
<LabelContent :label="$t('认证方式')">{{ authConfig.method }}</LabelContent>
<template v-if="authConfig.method === 'bearer_token'">
<LabelContent label="Token">************</LabelContent>
</template>
<template v-else>
<LabelContent :label="$t('用户名')">{{ authConfig.username }}</LabelContent>
<LabelContent :label="$t('密码')">******</LabelContent>
</template>
</Row>
<Row :title="$t('字段设置')">
<LabelContent :label="$t('字段映射')">
<div v-for="(item, index) in fieldMapping" :key="index">
<span>{{ item.target_field }}</span>
<span>=</span>
<span>{{ item.source_field }}</span>
</Row>
<Row :title="$t('认证配置')">
<LabelContent :label="$t('认证方式')">{{ authConfig.method }}</LabelContent>
<template v-if="authConfig.method === 'bearer_token'">
<LabelContent label="Token">************</LabelContent>
</template>
<template v-else>
<LabelContent :label="$t('用户名')">{{ authConfig.username }}</LabelContent>
<LabelContent :label="$t('密码')">******</LabelContent>
</template>
</Row>
<Row :title="$t('字段设置')">
<LabelContent :label="$t('字段映射')">
<div v-for="(item, index) in fieldMapping" :key="index">
<span>{{ item.target_field }}</span>
<span>=</span>
<span>{{ item.source_field }}</span>
</div>
</LabelContent>
</Row>
<Row :title="$t('同步配置')">
<LabelContent :label="$t('同步周期')">
<span class="value" v-for="(item, index) in SYNC_CONFIG_LIST" :key="index">
<span v-if="item.value === syncConfig.sync_period">{{ item.label }}</span>
</span>
</LabelContent>
</Row>
</div>
<div v-if="pluginId === 'ldap'">
<Row :title="$t('服务配置')">
<div class="flex">
<div class="flex-1">
<LabelContent :label="$t('LDAP 服务地址')">{{ serverConfig.server_url }}</LabelContent>
<LabelContent :label="$t('Bind DN')">{{ serverConfig.bind_dn }}</LabelContent>
<LabelContent :label="$t('Bind DN 密码')">{{ serverConfig.bind_password }}</LabelContent>
<LabelContent :label="$t('根目录 (Base DN)')">{{ serverConfig.base_dn }}</LabelContent>
</div>
<div class="flex-1">
<LabelContent :label="$t('分页请求每页数量')">{{ serverConfig.page_size }}</LabelContent>
<LabelContent :label="$t('请求超时时间')">{{ serverConfig.request_timeout }}{{ $t('秒') }}</LabelContent>
</div>
</div>
</LabelContent>
</Row>
<Row :title="$t('同步配置')">
<LabelContent :label="$t('同步周期')">
<span class="value" v-for="(item, index) in SYNC_CONFIG_LIST" :key="index">
<span v-if="item.value === syncConfig.sync_period">{{ item.label }}</span>
</span>
</LabelContent>
</Row>
</Row>
<Row :title="$t('数据配置')">
<LabelContent :label="$t('用户对象类')">{{ dataConfig.user_object_class }}</LabelContent>
<LabelContent :label="$t('用户 Base DN')">
<div v-for="(item, index) in dataConfig.user_search_base_dns" :key="index">{{ item }}</div>
</LabelContent>
<LabelContent :label="$t('部门对象类')">{{ dataConfig.dept_object_class }}</LabelContent>
<LabelContent :label="$t('部门 Base DN')">
<div v-for="(item, index) in dataConfig.dept_search_base_dns" :key="index">{{ item }}</div>
</LabelContent>
</Row>
<Row :title="$t('字段设置')">
<LabelContent :label="$t('字段映射')">
<div v-for="(item, index) in fieldMapping" :key="index">
<span>{{ item.target_field }}</span>
<span>=</span>
<span>{{ item.source_field }}</span>
</div>
</LabelContent>
</Row>
<Row :title="$t('用户组信息')" v-if="userGroupConfig.enabled">
<LabelContent :label="$t('用户组对象类')">{{ userGroupConfig.object_class }}</LabelContent>
<LabelContent :label="$t('用户组 Base DN')">
<div v-for="(item, index) in userGroupConfig.search_base_dns" :key="index">{{ item }}</div>
</LabelContent>
<LabelContent :label="$t('用户组成员字段')">{{ userGroupConfig.group_member_field }}</LabelContent>
</Row>
<Row :title="$t('Leader 信息')" v-if="leaderConfig.enabled">
<LabelContent :label="$t('Leader 字段名')">{{ leaderConfig.leader_field }}</LabelContent>
</Row>
<Row :title="$t('同步配置')">
<LabelContent :label="$t('同步周期')">
<span class="value" v-for="(item, index) in SYNC_CONFIG_LIST" :key="index">
<span v-if="item.value === syncConfig.sync_period">{{ item.label }}</span>
</span>
</LabelContent>
</Row>
</div>
</div>
<div class="details-info-box" v-else>
<bk-button theme="primary" @click="handleClickEdit">
Expand Down Expand Up @@ -91,15 +145,25 @@ const authConfig = ref({});
const fieldMapping = ref([]);
// 同步配置
const syncConfig = ref({});
// 数据配置
const dataConfig = ref({});
// 数据配置
const userGroupConfig = ref({});
// 数据配置
const leaderConfig = ref({});
const isPluginConfig = ref(true);
const pluginId = ref('');
onMounted(async () => {
try {
isLoading.value = true;
const res = await getDataSourceDetails(props.dataSourceId);
const fieldList = await getFields();
pluginId.value = res.data?.plugin?.id;
res.data?.field_mapping?.forEach((item) => {
[...fieldList?.data?.builtin_fields, ...fieldList?.data?.custom_fields]?.forEach((demo) => {
if (item.target_field === demo.name) {
Expand All @@ -117,6 +181,9 @@ onMounted(async () => {
} else {
serverConfig.value = res.data?.plugin_config?.server_config;
authConfig.value = res.data?.plugin_config?.auth_config;
dataConfig.value = res.data?.plugin_config?.data_config;
userGroupConfig.value = res.data?.plugin_config?.user_group_config;
leaderConfig.value = res.data?.plugin_config?.leader_config;
isPluginConfig.value = true;
}
syncConfig.value = res.data?.sync_config;
Expand Down

0 comments on commit aadd809

Please sign in to comment.