@liujitcn/kratos-admin-system 0.0.29 → 0.0.32

package/dist/package/src/views/base/runtime-config/index.vue

@@ -0,0 +1,479 @@
+<template>
+  <div v-loading="pageLoading" class="table-box runtime-config-page">
+    <main class="runtime-config-shell">
+      <aside class="runtime-config-navigation" :aria-label="t('system.base.runtime_config.navigation')">
+        <header class="runtime-config-navigation__header">
+          <el-input
+            v-model="keyword"
+            clearable
+            :placeholder="t('system.base.runtime_config.placeholder.search')"
+            :prefix-icon="Search"
+          />
+          <span class="runtime-config-count">{{ filteredDefinitions.length }} / {{ runtimeConfigDefinitions.length }}</span>
+        </header>
+
+        <nav
+          v-if="filteredDefinitions.length"
+          class="runtime-config-list"
+          :aria-label="t('system.base.runtime_config.navigation')"
+        >
+          <button
+            v-for="definition in filteredDefinitions"
+            :key="definition.key"
+            type="button"
+            class="runtime-config-item"
+            :class="{ 'is-active': definition.key === selectedKey }"
+            @click="selectConfig(definition.key)"
+          >
+            <el-icon class="runtime-config-item__icon"><component :is="definition.icon" /></el-icon>
+            <span class="runtime-config-item__text">
+              <strong>{{ t(definition.titleKey) }}</strong>
+              <small>{{ definition.key }}</small>
+            </span>
+          </button>
+        </nav>
+        <el-empty v-else :description="t('system.base.runtime_config.message.no_match')" :image-size="72" />
+      </aside>
+
+      <section class="runtime-config-content">
+        <div v-if="!selectedDefinition" class="runtime-config-empty">
+          <el-empty :description="t('system.base.runtime_config.message.select')" />
+        </div>
+        <template v-else>
+          <header class="runtime-config-header">
+            <div class="runtime-config-header__identity">
+              <span class="runtime-config-header__icon">
+                <el-icon><component :is="selectedDefinition.icon" /></el-icon>
+              </span>
+              <div>
+                <h1>{{ t(selectedDefinition.titleKey) }}</h1>
+                <p>{{ t(selectedDefinition.descriptionKey) }}</p>
+              </div>
+            </div>
+            <time v-if="updatedAt" :datetime="updatedAt" :title="updatedAt">
+              {{ t("system.base.runtime_config.value.updated_at", { time: formatUpdatedAt(updatedAt) }) }}
+            </time>
+          </header>
+
+          <div v-loading="configLoading" class="runtime-config-form-scroll">
+            <el-skeleton v-if="configLoading && !loadedKeys.has(selectedDefinition.key)" :rows="8" animated />
+            <ProForm
+              v-else
+              :key="selectedDefinition.key"
+              ref="formRef"
+              :model="selectedModel"
+              :fields="localizedFields"
+              label-width="220px"
+            />
+          </div>
+
+          <footer v-if="canUpdateRuntimeConfig" class="runtime-config-footer">
+            <el-button type="primary" :icon="Check" :loading="configSaving" @click="saveCurrent">
+              {{ t("common.action.save") }}
+            </el-button>
+          </footer>
+        </template>
+      </section>
+    </main>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, reactive, ref, watch } from "vue";
+import { Check, Search } from "@element-plus/icons-vue";
+import { ElMessage } from "element-plus";
+import { getCurrentLocale, t, useLocaleStore } from "@liujitcn/kratos-admin-core";
+import ProForm from "@liujitcn/kratos-admin-core/components/ProForm/index.vue";
+import type { ProFormField, ProFormInstance } from "@liujitcn/kratos-admin-core/components/ProForm/interface";
+import { useAuthButtons } from "@liujitcn/kratos-admin-core/auth";
+import { defBaseConfigService } from "@liujitcn/kratos-admin-system/api/system/admin/v1/base_config";
+import {
+  runtimeConfigDefinitions,
+  type RuntimeConfigDefinition,
+  type RuntimeConfigField,
+  type RuntimeConfigMessageArg,
+  type RuntimeConfigModel
+} from "@liujitcn/kratos-admin-system/config";
+
+defineOptions({ name: "BaseRuntimeConfig", inheritAttrs: false });
+
+const { locale } = useLocaleStore();
+const { BUTTONS } = useAuthButtons();
+/** 判断当前用户是否拥有运行配置更新权限。 */
+const canUpdateRuntimeConfig = computed(() => !!BUTTONS.value["base:runtime-config:update"]);
+const pageLoading = ref(false);
+const configLoading = ref(false);
+const configSaving = ref(false);
+const keyword = ref("");
+const selectedKey = ref("");
+const updatedAt = ref("");
+const loadedKeys = reactive(new Set<string>());
+const models = reactive<Record<string, RuntimeConfigModel>>({});
+const formRef = ref<ProFormInstance>();
+let requestToken = 0;
+
+const sortedDefinitions = computed(() => {
+  const currentLocale = locale.value;
+  return [...runtimeConfigDefinitions].sort((left, right) => {
+    const titleOrder = t(left.titleKey).localeCompare(t(right.titleKey), currentLocale || getCurrentLocale(), {
+      sensitivity: "base"
+    });
+    return titleOrder || left.key.localeCompare(right.key);
+  });
+});
+
+const filteredDefinitions = computed(() => {
+  const search = keyword.value.trim().toLocaleLowerCase();
+  if (!search) return sortedDefinitions.value;
+  return sortedDefinitions.value.filter(definition => {
+    return [t(definition.titleKey), t(definition.descriptionKey), definition.key].some(value =>
+      value.toLocaleLowerCase().includes(search)
+    );
+  });
+});
+
+const selectedDefinition = computed<RuntimeConfigDefinition | undefined>(() => {
+  return runtimeConfigDefinitions.find(definition => definition.key === selectedKey.value);
+});
+
+const selectedModel = computed(() => {
+  return selectedKey.value ? (models[selectedKey.value] ?? {}) : {};
+});
+
+const localizedFields = computed<ProFormField[]>(() => {
+  if (!selectedDefinition.value) return [];
+  return selectedDefinition.value.fields.map(localizeField);
+});
+
+/** 加载指定配置并恢复默认模型。 */
+async function loadConfig(key: string) {
+  const definition = runtimeConfigDefinitions.find(item => item.key === key);
+  if (!definition) return;
+  const currentToken = requestToken + 1;
+  requestToken = currentToken;
+  configLoading.value = true;
+  if (!models[key]) models[key] = definition.createModel();
+  try {
+    const result = await defBaseConfigService.GetBaseConfigByKey({ key });
+    if (requestToken !== currentToken || selectedKey.value !== key) return;
+    Object.assign(models[key], JSON.parse(result.value_json) as RuntimeConfigModel);
+    updatedAt.value = result.updated_at;
+    loadedKeys.add(key);
+  } catch {
+    if (requestToken === currentToken) ElMessage.error(t("system.base.runtime_config.message.load_failed"));
+  } finally {
+    if (requestToken === currentToken) configLoading.value = false;
+  }
+}
+
+/** 切换当前配置表单。 */
+function selectConfig(key: string) {
+  if (selectedKey.value === key) return;
+  selectedKey.value = key;
+  updatedAt.value = "";
+  formRef.value?.clearValidate();
+  void loadConfig(key);
+}
+
+/** 保存当前配置并刷新服务端缓存。 */
+async function saveCurrent() {
+  const definition = selectedDefinition.value;
+  if (!canUpdateRuntimeConfig.value || !definition || !selectedKey.value) return;
+  const valid = await formRef.value?.validate();
+  if (valid !== true) return;
+  configSaving.value = true;
+  try {
+    await defBaseConfigService.UpdateBaseConfigByKey({
+      key: definition.key,
+      value_json: JSON.stringify(selectedModel.value)
+    });
+    loadedKeys.add(definition.key);
+    ElMessage.success(t("system.base.runtime_config.message.save_success"));
+  } catch {
+    ElMessage.error(t("system.base.runtime_config.message.save_failed"));
+  } finally {
+    configSaving.value = false;
+  }
+}
+
+/** 将配置字段定义本地化为 ProForm 字段。 */
+function localizeField(field: RuntimeConfigField): ProFormField {
+  const fieldProps = field.props;
+  return {
+    prop: field.prop,
+    label: t(field.labelKey),
+    component: field.component,
+    props:
+      typeof fieldProps === "function"
+        ? model => {
+            const props = fieldProps(model);
+            return { ...props, disabled: !canUpdateRuntimeConfig.value || Boolean(props.disabled) };
+          }
+        : { ...(fieldProps ?? {}), disabled: !canUpdateRuntimeConfig.value || Boolean(fieldProps?.disabled) },
+    itemProps: field.itemProps,
+    options: field.options,
+    visible: field.visible,
+    labelTooltip: field.labelTooltipKey ? t(field.labelTooltipKey) : undefined,
+    rules: field.rules?.map(rule => ({
+      ...rule,
+      message: t(rule.messageKey, localizeArgs(rule.messageArgs))
+    }))
+  };
+}
+
+/** 将配置校验规则中的消息键参数转换为当前语言文本。 */
+function localizeArgs(args?: Record<string, RuntimeConfigMessageArg>) {
+  if (!args) return undefined;
+  const result: Record<string, string | number> = {};
+  for (const [key, value] of Object.entries(args)) {
+    result[key] = typeof value === "object" ? t(value.key) : typeof value === "boolean" ? String(value) : value;
+  }
+  return result;
+}
+
+/** 格式化配置更新时间。 */
+function formatUpdatedAt(value: string) {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return new Intl.DateTimeFormat(getCurrentLocale(), {
+    month: "2-digit",
+    day: "2-digit",
+    hour: "2-digit",
+    minute: "2-digit",
+    hourCycle: "h23"
+  })
+    .format(date)
+    .replaceAll("/", "-");
+}
+
+watch(locale, () => {
+  if (!selectedKey.value) return;
+  void loadConfig(selectedKey.value);
+});
+
+onMounted(async () => {
+  pageLoading.value = true;
+  try {
+    const firstDefinition = sortedDefinitions.value[0];
+    if (firstDefinition) {
+      selectedKey.value = firstDefinition.key;
+      await loadConfig(firstDefinition.key);
+    }
+  } finally {
+    pageLoading.value = false;
+  }
+});
+</script>
+
+<style scoped lang="scss">
+.runtime-config-page {
+  box-sizing: border-box;
+  color: var(--admin-page-text-primary);
+  background: var(--el-bg-color-page);
+}
+
+.runtime-config-shell {
+  display: grid;
+  grid-template-columns: 300px minmax(0, 1fr);
+  min-width: 0;
+  min-height: 560px;
+  overflow: hidden;
+  background: var(--admin-page-card-bg);
+  border: 1px solid var(--admin-page-card-border);
+  border-radius: var(--admin-page-radius);
+  box-shadow: var(--admin-page-shadow);
+}
+
+.runtime-config-navigation,
+.runtime-config-content {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.runtime-config-navigation {
+  border-right: 1px solid var(--admin-page-divider);
+}
+
+.runtime-config-navigation__header {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  padding: 16px;
+  border-bottom: 1px solid var(--admin-page-divider);
+}
+
+.runtime-config-count {
+  flex: 0 0 auto;
+  font-size: 12px;
+  color: var(--admin-page-text-secondary);
+  white-space: nowrap;
+}
+
+.runtime-config-list {
+  flex: 1;
+  min-height: 0;
+  padding: 8px;
+  overflow-y: auto;
+}
+
+.runtime-config-item {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  width: 100%;
+  min-height: 64px;
+  padding: 10px 12px;
+  color: var(--admin-page-text-primary);
+  text-align: left;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  border-radius: 6px;
+  transition:
+    background-color 0.2s ease,
+    color 0.2s ease;
+}
+
+.runtime-config-item:hover {
+  background: var(--el-fill-color-light);
+}
+
+.runtime-config-item.is-active {
+  color: var(--el-color-primary);
+  background: var(--el-color-primary-light-9);
+}
+
+.runtime-config-item__icon {
+  flex: 0 0 auto;
+  font-size: 18px;
+}
+
+.runtime-config-item__text {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  gap: 4px;
+}
+
+.runtime-config-item__text strong,
+.runtime-config-item__text small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.runtime-config-item__text strong {
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.runtime-config-item__text small {
+  color: var(--admin-page-text-secondary);
+  font-size: 12px;
+}
+
+.runtime-config-content {
+  background: var(--el-bg-color-page);
+}
+
+.runtime-config-header {
+  display: flex;
+  gap: 24px;
+  align-items: flex-start;
+  justify-content: space-between;
+  padding: 24px 28px;
+  background: var(--admin-page-card-bg);
+  border-bottom: 1px solid var(--admin-page-divider);
+}
+
+.runtime-config-header__identity {
+  display: flex;
+  gap: 14px;
+  align-items: flex-start;
+  min-width: 0;
+}
+
+.runtime-config-header__icon {
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  color: var(--el-color-primary);
+  background: var(--el-color-primary-light-9);
+  border-radius: 8px;
+}
+
+.runtime-config-header h1 {
+  margin: 0;
+  color: var(--admin-page-text-primary);
+  font-size: 20px;
+  font-weight: 650;
+}
+
+.runtime-config-header p {
+  max-width: 720px;
+  margin: 8px 0 0;
+  color: var(--admin-page-text-secondary);
+  line-height: 1.6;
+}
+
+.runtime-config-header time {
+  flex: 0 0 auto;
+  color: var(--admin-page-text-secondary);
+  font-size: 12px;
+  white-space: nowrap;
+}
+
+.runtime-config-form-scroll {
+  flex: 1;
+  min-height: 0;
+  padding: 28px;
+  overflow-y: auto;
+  background: var(--admin-page-card-bg);
+}
+
+.runtime-config-footer {
+  display: flex;
+  justify-content: flex-end;
+  padding: 16px 28px;
+  background: var(--admin-page-card-bg);
+  border-top: 1px solid var(--admin-page-divider);
+}
+
+.runtime-config-empty {
+  display: grid;
+  flex: 1;
+  place-items: center;
+  background: var(--admin-page-card-bg);
+}
+
+@media (max-width: 800px) {
+  .runtime-config-shell {
+    grid-template-columns: 1fr;
+  }
+
+  .runtime-config-navigation {
+    max-height: 280px;
+    border-right: 0;
+    border-bottom: 1px solid var(--admin-page-divider);
+  }
+
+  .runtime-config-header {
+    flex-direction: column;
+    padding: 20px;
+  }
+
+  .runtime-config-form-scroll {
+    padding: 20px;
+  }
+
+  .runtime-config-footer {
+    padding: 14px 20px;
+  }
+}
+</style>

package/dist/package/src/views/base/tenant/index.vue

@@ -12,7 +12,7 @@
     <FormDialog
       v-model="dialog.visible"
       ref="formDialogRef"
-      :title="t(dialog.titleKey, { resource: t('system.base.tenant.resource') })"
+      :title="t(dialog.titleKey, { resource: t('common.field.tenant') })"
       width="780px"
       :model="formData"
       :fields="formFields"
@@ -32,7 +32,7 @@ import ProTable from "@liujitcn/kratos-admin-core/components/ProTable";
 import FormDialog from "@liujitcn/kratos-admin-core/components/Dialog/FormDialog.vue";
 import type { ProFormField, ProFormOption } from "@liujitcn/kratos-admin-core/components/ProForm/interface";
 import { useAuthButtons } from "@liujitcn/kratos-admin-core/auth";
-import { defBaseTenantService } from "@liujitcn/kratos-admin-system/api/system/base_tenant";
+import { defBaseTenantService } from "@liujitcn/kratos-admin-system/api/system/admin/v1/base_tenant";
 import type {
   BaseTenant,
   BaseTenantForm,
@@ -303,7 +303,7 @@ function handleSubmit() {
     request.then(() => {
       ElMessage.success(
         t(submitData.id ? "common.message.update_success" : "common.message.create_success", {
-          resource: t("system.base.tenant.resource")
+          resource: t("common.field.tenant")
         })
       );
       handleCloseDialog();
@@ -327,7 +327,7 @@ async function handleBeforeSetStatus(row: BaseTenant) {
     await ElMessageBox.confirm(
       t("common.dialog.status_change", {
         action: text,
-        resource: t("system.base.tenant.resource"),
+        resource: t("common.field.tenant"),
         field: t("system.base.tenant.field.name"),
         value: row.name || `ID:${row.id}`
       }),
@@ -373,9 +373,9 @@ function handleDelete(selected?: number | string | Array<number | string> | Base
 
   const confirmMessage = tenantList.length
     ? tenantList.length === 1
-      ? `${t("common.dialog.delete_single", { resource: t("system.base.tenant.resource") })}\n${t("common.dialog.resource_field", { field: t("system.base.tenant.field.name"), value: tenantList[0].name || `ID:${tenantList[0].id}` })}`
-      : t("common.dialog.delete_batch", { count: tenantList.length, unit: "", resource: t("system.base.tenant.resource") })
-    : t("common.dialog.delete_selected", { resource: t("system.base.tenant.resource") });
+      ? `${t("common.dialog.delete_single", { resource: t("common.field.tenant") })}\n${t("common.dialog.resource_field", { field: t("system.base.tenant.field.name"), value: tenantList[0].name || `ID:${tenantList[0].id}` })}`
+      : t("common.dialog.delete_batch", { count: tenantList.length, unit: "", resource: t("common.field.tenant") })
+    : t("common.dialog.delete_selected", { resource: t("common.field.tenant") });
 
   ElMessageBox.confirm(confirmMessage, t("common.title.warning"), {
     confirmButtonText: t("common.action.confirm"),
@@ -384,12 +384,12 @@ function handleDelete(selected?: number | string | Array<number | string> | Base
   }).then(
     () => {
       defBaseTenantService.DeleteBaseTenant({ id: tenantIds }).then(() => {
-        ElMessage.success(t("common.message.delete_success", { resource: t("system.base.tenant.resource") }));
+        ElMessage.success(t("common.message.delete_success", { resource: t("common.field.tenant") }));
         refreshTable();
       });
     },
     () => {
-      ElMessage.info(t("common.dialog.cancel_delete", { resource: t("system.base.tenant.resource") }));
+      ElMessage.info(t("common.dialog.cancel_delete", { resource: t("common.field.tenant") }));
     }
   );
 }

package/dist/package/src/views/base/user/components/dept-tree.vue

@@ -25,7 +25,7 @@
 import { onBeforeMount, ref, watchEffect } from "vue";
 import { useVModel } from "@vueuse/core";
 import { ElTree } from "element-plus";
-import { defBaseDeptService } from "@liujitcn/kratos-admin-system/api/system/base_dept";
+import { defBaseDeptService } from "@liujitcn/kratos-admin-system/api/system/admin/v1/base_dept";
 import { TreeOptionResponse_Option } from "@liujitcn/kratos-admin-system/rpc/common/v1/common";
 import { t } from "@liujitcn/kratos-admin-core";
 const props = defineProps({