@liujitcn/kratos-admin-system 0.0.20 → 0.0.23

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

@@ -0,0 +1,260 @@
+<!-- 语言管理 -->
+<template>
+  <div class="table-box">
+    <ProTable
+      ref="proTable"
+      row-key="id"
+      :columns="columns"
+      :header-actions="headerActions"
+      :request-api="requestBaseLanguageTable"
+    />
+
+    <FormDialog
+      v-model="dialog.visible"
+      ref="formDialogRef"
+      :title="t(dialog.editing ? 'system.base.language.action.edit' : 'system.base.language.action.create')"
+      width="620px"
+      :model="formData"
+      :fields="formFields"
+      :rules="rules"
+      @confirm="handleSubmit"
+      @close="handleCloseDialog"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, reactive, ref } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { CirclePlus, Delete, EditPen } from "@element-plus/icons-vue";
+import type { ColumnProps, HeaderActionProps, ProTableInstance } from "@liujitcn/kratos-admin-core/components/ProTable/interface";
+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 { buildPageRequest, normalizeSelectedIds } from "@liujitcn/kratos-admin-core/table";
+import { applyLanguageConfig, defLanguageService, t } from "@liujitcn/kratos-admin-core";
+import { defBaseLanguageService, invalidateEnabledBaseLanguages } from "@liujitcn/kratos-admin-system/api/system/base_language";
+import type { BaseLanguage, BaseLanguageForm, PageBaseLanguageRequest } from "@liujitcn/kratos-admin-system/rpc/system/admin/v1/base_language";
+import { Status } from "@liujitcn/kratos-admin-system/rpc/common/v1/enum";
+
+defineOptions({ name: "BaseLanguage", inheritAttrs: false });
+
+const { BUTTONS } = useAuthButtons();
+const proTable = ref<ProTableInstance>();
+const formDialogRef = ref<InstanceType<typeof FormDialog>>();
+const dialog = reactive({ editing: false, visible: false });
+const formData = reactive<BaseLanguageForm>({
+  id: 0,
+  language_code: "",
+  language_name: "",
+  native_name: "",
+  sort: 100,
+  status: Status.ENABLE
+});
+
+const rules = computed(() => ({
+  language_code: [
+    { required: true, message: t("system.base.language.placeholder.code"), trigger: "blur" },
+    { max: 16, message: t("common.validation.max_length", { field: t("system.base.language.field.code"), max: 16 }), trigger: "blur" }
+  ],
+  language_name: [
+    { required: true, message: t("system.base.language.placeholder.name"), trigger: "blur" },
+    { max: 50, message: t("common.validation.max_length", { field: t("system.base.language.field.name"), max: 50 }), trigger: "blur" }
+  ],
+  native_name: [
+    { required: true, message: t("system.base.language.placeholder.native_name"), trigger: "blur" },
+    { max: 50, message: t("common.validation.max_length", { field: t("system.base.language.field.native_name"), max: 50 }), trigger: "blur" }
+  ],
+  sort: [{ required: true, message: t("system.base.language.placeholder.sort"), trigger: "change" }]
+}));
+
+const statusOptions = computed<ProFormOption[]>(() => [
+  { label: t("common.status.enabled"), value: Status.ENABLE },
+  { label: t("common.status.disabled"), value: Status.DISABLE }
+]);
+
+const formFields = computed<ProFormField[]>(() => [
+  { prop: "language_code", label: t("system.base.language.field.code"), component: "input", props: { placeholder: t("system.base.language.placeholder.code"), disabled: dialog.editing } },
+  { prop: "language_name", label: t("system.base.language.field.name"), component: "input", props: { placeholder: t("system.base.language.placeholder.name") } },
+  { prop: "native_name", label: t("system.base.language.field.native_name"), component: "input", props: { placeholder: t("system.base.language.placeholder.native_name") } },
+  { prop: "sort", label: t("system.base.language.field.sort"), component: "input-number", props: { min: 0, controlsPosition: "right", style: { width: "100%" } } },
+  { prop: "status", label: t("system.base.language.field.status"), component: "radio-group", options: statusOptions.value }
+]);
+
+const columns = computed<ColumnProps[]>(() => [
+  { prop: "native_name", label: t("system.base.language.field.native_name"), minWidth: 130 },
+  { prop: "language_name", label: t("system.base.language.field.name"), minWidth: 130, search: { el: "input" } },
+  { prop: "language_code", label: t("system.base.language.field.code"), minWidth: 120, search: { el: "input" } },
+  {
+    prop: "is_primary",
+    label: t("system.base.language.field.primary"),
+    minWidth: 100,
+    cellType: "status",
+    statusProps: {
+      activeValue: true,
+      inactiveValue: false,
+      activeText: t("common.status.enabled"),
+      inactiveText: t("common.status.disabled"),
+      disabled: () => !BUTTONS.value["base:language:primary"],
+      beforeChange: scope => handleBeforeSetPrimary(scope.row as BaseLanguage)
+    }
+  },
+  {
+    prop: "status",
+    label: t("system.base.language.field.status"),
+    minWidth: 100,
+    search: { el: "select" },
+    cellType: "status",
+    statusProps: {
+      activeValue: Status.ENABLE,
+      inactiveValue: Status.DISABLE,
+      activeText: t("common.status.enabled"),
+      inactiveText: t("common.status.disabled"),
+      disabled: () => !BUTTONS.value["base:language:status"],
+      beforeChange: scope => handleBeforeSetStatus(scope.row as BaseLanguage)
+    }
+  },
+  { prop: "sort", label: t("system.base.language.field.sort"), width: 80 },
+  { prop: "created_at", label: t("common.field.created_at"), minWidth: 180 },
+  {
+    prop: "operation",
+    label: t("common.field.operation"),
+    width: 150,
+    fixed: "right",
+    cellType: "actions",
+    actions: [
+      { label: t("common.action.edit"), type: "primary", link: true, icon: EditPen, hidden: () => !BUTTONS.value["base:language:update"], onClick: scope => handleOpenDialog((scope.row as BaseLanguage).id) },
+      { label: t("common.action.delete"), type: "danger", link: true, icon: Delete, hidden: () => !BUTTONS.value["base:language:delete"], onClick: scope => handleDelete(scope.row as BaseLanguage) }
+    ]
+  }
+]);
+
+const headerActions = computed<HeaderActionProps[]>(() => [
+  { label: t("common.action.create"), type: "success", icon: CirclePlus, hidden: () => !BUTTONS.value["base:language:create"], onClick: () => handleOpenDialog() },
+  { label: t("common.action.delete"), type: "danger", icon: Delete, hidden: () => !BUTTONS.value["base:language:delete"], disabled: scope => !scope.selectedList.length, onClick: scope => handleDelete(scope.selectedList as BaseLanguage[]) }
+]);
+
+/** 请求语言分页列表。 */
+async function requestBaseLanguageTable(params: PageBaseLanguageRequest) {
+  const data = await defBaseLanguageService.PageBaseLanguage(buildPageRequest(params));
+  return { data: { list: data.base_languages ?? [], total: data.total } };
+}
+
+/** 打开语言编辑弹窗。 */
+async function handleOpenDialog(id?: number) {
+  resetForm();
+  dialog.editing = Boolean(id);
+  dialog.visible = true;
+  if (!id) return;
+  Object.assign(formData, await defBaseLanguageService.GetBaseLanguage({ id }));
+}
+
+/** 关闭语言编辑弹窗。 */
+function handleCloseDialog() {
+  dialog.visible = false;
+  resetForm();
+}
+
+/** 重置语言表单。 */
+function resetForm() {
+  formDialogRef.value?.resetFields();
+  formDialogRef.value?.clearValidate();
+  Object.assign(formData, { id: 0, language_code: "", language_name: "", native_name: "", sort: 100, status: Status.ENABLE });
+}
+
+/** 提交语言表单。 */
+function handleSubmit() {
+  formDialogRef.value?.validate()?.then(valid => {
+    if (!valid) return;
+    const payload = JSON.parse(JSON.stringify(formData)) as BaseLanguageForm;
+    const request = payload.id
+      ? defBaseLanguageService.UpdateBaseLanguage({ base_language: payload })
+      : defBaseLanguageService.CreateBaseLanguage({ base_language: payload });
+    request.then(() => {
+      invalidateEnabledBaseLanguages();
+      void refreshAdminLanguageConfig();
+      ElMessage.success(t(payload.id ? "common.message.update_success" : "common.message.create_success", { resource: t("system.base.language.resource") }));
+      handleCloseDialog();
+      proTable.value?.getTableList();
+    });
+  });
+}
+
+/** 设置语言状态前保护主语言。 */
+function handleBeforeSetStatus(row: BaseLanguage) {
+  if (row.is_primary && row.status === Status.ENABLE) {
+    ElMessage.warning(t("system.base.language.message.primary_cannot_disable"));
+    return Promise.resolve(false);
+  }
+  return ElMessageBox.confirm(
+    t("system.base.language.message.confirm_status", { action: row.status === Status.ENABLE ? t("common.status.disabled") : t("common.status.enabled"), name: row.native_name }),
+    t("common.title.warning"),
+    { type: "warning", confirmButtonText: t("common.action.confirm"), cancelButtonText: t("common.action.cancel") }
+  ).then(
+    () =>
+      defBaseLanguageService
+        .SetBaseLanguageStatus({ id: row.id, status: row.status === Status.ENABLE ? Status.DISABLE : Status.ENABLE })
+        .then(() => {
+          invalidateEnabledBaseLanguages();
+          void refreshAdminLanguageConfig();
+          return true;
+        }),
+    () => false
+  );
+}
+
+/** 设置主语言前确认切换。 */
+function handleBeforeSetPrimary(row: BaseLanguage) {
+  if (row.is_primary) return Promise.resolve(false);
+  return ElMessageBox.confirm(
+    t("system.base.language.message.confirm_primary", { name: row.native_name }),
+    t("common.title.warning"),
+    { type: "warning", confirmButtonText: t("common.action.confirm"), cancelButtonText: t("common.action.cancel") }
+  ).then(
+    () =>
+      defBaseLanguageService
+        .SetBaseLanguagePrimary({ id: row.id })
+        .then(() => {
+          invalidateEnabledBaseLanguages();
+          void refreshAdminLanguageConfig();
+          proTable.value?.getTableList();
+          return true;
+        }),
+    () => false
+  );
+}
+
+/** 删除语言，兼容单项和批量操作。 */
+function handleDelete(selected?: BaseLanguage | BaseLanguage[] | number | string | Array<number | string>) {
+  const rows = Array.isArray(selected) ? (selected.filter(item => typeof item === "object") as BaseLanguage[]) : selected && typeof selected === "object" ? [selected] : [];
+  if (rows.some(item => item.is_primary)) {
+    ElMessage.warning(t("system.base.language.message.primary_cannot_delete"));
+    return;
+  }
+  const ids = (rows.length ? rows.map(item => item.id) : normalizeSelectedIds(selected as number | string | Array<number | string>)).join(",");
+  if (!ids) {
+    ElMessage.warning(t("common.message.select_delete_item"));
+    return;
+  }
+  ElMessageBox.confirm(t("system.base.language.message.confirm_delete", { name: rows.length === 1 ? rows[0].native_name : ids }), t("common.title.warning"), {
+    type: "warning",
+    confirmButtonText: t("common.action.confirm"),
+    cancelButtonText: t("common.action.cancel")
+  }).then(() => defBaseLanguageService.DeleteBaseLanguage({ id: ids })).then(() => {
+    invalidateEnabledBaseLanguages();
+    void refreshAdminLanguageConfig();
+    ElMessage.success(t("common.message.delete_success", { resource: t("system.base.language.resource") }));
+    proTable.value?.getTableList();
+  });
+}
+
+/** refreshAdminLanguageConfig 刷新核心语言切换器的运行时配置。 */
+async function refreshAdminLanguageConfig() {
+  try {
+    applyLanguageConfig(await defLanguageService.OptionLanguage({}));
+  } catch {
+    // 语言管理操作成功但公共语言查询失败时，保留当前切换器配置。
+  }
+}
+</script>

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

@@ -2,69 +2,92 @@
   <div class="table-box">
     <ProTable ref="proTable" row-key="id" :columns="columns" :request-api="requestBaseLogTable" />
 
-    <ProDialog v-model="dialog.visible" :title="dialog.title" width="1500px" @close="handleCloseDialog">
+    <ProDialog v-model="dialog.visible" :title="t('system.base.log.title.detail')" width="1500px" @close="handleCloseDialog">
       <div class="detail-container">
-        <el-descriptions title="基础信息" border :column="2">
-          <el-descriptions-item label="操作结果">
+        <el-descriptions :title="t('system.base.log.section.basic')" border :column="2">
+          <el-descriptions-item :label="t('system.base.log.field.result')">
             <el-tag :type="detail.is_success ? 'success' : 'danger'" effect="light">
-              {{ detail.is_success ? "成功" : "失败" }}
+              {{ t(detail.is_success ? "system.base.log.status.success" : "system.base.log.status.failed") }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="状态码">
+          <el-descriptions-item :label="t('system.base.log.field.status_code')">
             <el-tag :type="statusCodeColor" effect="light">{{ detail.status_code || "--" }}</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="耗时">{{ detail.cost_time || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="操作时间">{{ detail.request_time || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.cost_time')">{{ detail.cost_time || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.request_time')">{{
+            detail.request_time || "--"
+          }}</el-descriptions-item>
         </el-descriptions>
 
-        <el-descriptions title="请求信息" border :column="2" direction="vertical" class="mt-4 compact-descriptions">
-          <el-descriptions-item label="请求ID">{{ detail.request_id || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="操作方法">
+        <el-descriptions
+          :title="t('system.base.log.section.request')"
+          border
+          :column="2"
+          direction="vertical"
+          class="mt-4 compact-descriptions"
+        >
+          <el-descriptions-item :label="t('system.base.log.field.request_id')">{{ detail.request_id || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.operation')">
             <el-tag effect="plain">{{ detail.operation || "--" }}</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="请求方法">
+          <el-descriptions-item :label="t('system.base.log.field.method')">
             <el-tag effect="plain">{{ detail.method || "--" }}</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="请求路径">{{ detail.path || "--" }}</el-descriptions-item>
-          <el-descriptions-item v-if="detail.request_uri" label="请求 URI" :span="2">{{
+          <el-descriptions-item :label="t('system.base.log.field.path')">{{ detail.path || "--" }}</el-descriptions-item>
+          <el-descriptions-item v-if="detail.request_uri" :label="t('system.base.log.field.request_uri')" :span="2">{{
             detail.request_uri
           }}</el-descriptions-item>
-          <el-descriptions-item v-if="detail.referer" label="来源页" :span="2">{{ detail.referer }}</el-descriptions-item>
-          <el-descriptions-item label="请求头" :span="2">
+          <el-descriptions-item v-if="detail.referer" :label="t('system.base.log.field.referer')" :span="2">{{
+            detail.referer
+          }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.request_header')" :span="2">
             <pre class="code-block">{{ formatPayload(detail.request_header) }}</pre>
           </el-descriptions-item>
-          <el-descriptions-item label="请求体" :span="2">
+          <el-descriptions-item :label="t('system.base.log.field.request_body')" :span="2">
             <pre class="code-block">{{ formatPayload(detail.request_body) }}</pre>
           </el-descriptions-item>
-          <el-descriptions-item label="请求结果" :span="2">
+          <el-descriptions-item :label="t('system.base.log.field.request_result')" :span="2">
             <pre class="code-block">{{ formatPayload(detail.response) }}</pre>
           </el-descriptions-item>
         </el-descriptions>
 
-        <el-descriptions title="用户信息" border :column="2" class="mt-4">
-          <el-descriptions-item label="用户ID">{{ detail.user_id || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="用户名">{{ detail.user_name || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="客户端IP">{{ detail.client_ip || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="地理位置">{{ detail.location || "--" }}</el-descriptions-item>
+        <el-descriptions :title="t('system.base.log.section.user')" border :column="2" class="mt-4">
+          <el-descriptions-item :label="t('system.base.log.field.user_id')">{{ detail.user_id || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.user_name')">{{ detail.user_name || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.client_ip')">{{ detail.client_ip || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.location')">{{ detail.location || "--" }}</el-descriptions-item>
         </el-descriptions>
 
-        <el-descriptions title="客户端信息" border :column="2" direction="vertical" class="mt-4 compact-descriptions">
-          <el-descriptions-item label="浏览器">
+        <el-descriptions
+          :title="t('system.base.log.section.client')"
+          border
+          :column="2"
+          direction="vertical"
+          class="mt-4 compact-descriptions"
+        >
+          <el-descriptions-item :label="t('system.base.log.field.browser')">
             {{ [detail.browser_name, detail.browser_version].filter(Boolean).join(" ") || "--" }}
           </el-descriptions-item>
-          <el-descriptions-item label="操作系统">
+          <el-descriptions-item :label="t('system.base.log.field.os')">
             {{ [detail.os_name, detail.os_version].filter(Boolean).join(" ") || "--" }}
           </el-descriptions-item>
-          <el-descriptions-item label="客户端名称">{{ detail.client_name || "--" }}</el-descriptions-item>
-          <el-descriptions-item label="客户端ID">{{ detail.client_id || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.client_name')">{{ detail.client_name || "--" }}</el-descriptions-item>
+          <el-descriptions-item :label="t('system.base.log.field.client_id')">{{ detail.client_id || "--" }}</el-descriptions-item>
           <el-descriptions-item label="User Agent" :span="2">{{ detail.user_agent || "--" }}</el-descriptions-item>
         </el-descriptions>
 
-        <el-alert v-if="!detail.is_success" title="失败原因" type="error" :description="detail.reason" class="mt-4" show-icon />
+        <el-alert
+          v-if="!detail.is_success"
+          :title="t('system.base.log.field.reason')"
+          type="error"
+          :description="detail.reason"
+          class="mt-4"
+          show-icon
+        />
       </div>
 
       <template #footer>
-        <el-button @click="handleCloseDialog">关闭</el-button>
+        <el-button @click="handleCloseDialog">{{ t("common.action.close") }}</el-button>
       </template>
     </ProDialog>
   </div>
@@ -80,6 +103,7 @@ import { defBaseLogService } from "@liujitcn/kratos-admin-system/api/system/base
 import { buildPageRequest } from "@liujitcn/kratos-admin-core/table";
 import { formatJson } from "@liujitcn/kratos-admin-core/format";
 import type { BaseLog, PageBaseLogRequest } from "@liujitcn/kratos-admin-system/rpc/system/admin/v1/base_log";
+import { t } from "@liujitcn/kratos-admin-core";
 
 defineOptions({
   name: "BaseLog",
@@ -89,7 +113,6 @@ defineOptions({
 const proTable = ref<ProTableInstance>();
 
 const dialog = reactive({
-  title: "",
   visible: false
 });
 
@@ -194,22 +217,22 @@ function formatPayload(value: string): string {
 }
 
 /** 日志表格列配置。 */
-const columns: ColumnProps[] = [
+const columns = computed<ColumnProps[]>(() => [
   {
     prop: "operation",
-    label: "操作方法",
+    label: t("system.base.log.field.operation"),
     minWidth: 240,
     search: { el: "input" }
   },
   {
     prop: "status_code",
-    label: "状态码",
+    label: t("system.base.log.field.status_code"),
     minWidth: 100,
     search: { el: "input-number", props: { min: 0, controlsPosition: "right" } }
   },
   {
     prop: "request_time",
-    label: "操作时间",
+    label: t("system.base.log.field.request_time"),
     minWidth: 140,
     search: {
       el: "date-picker",
@@ -218,27 +241,27 @@ const columns: ColumnProps[] = [
         editable: false,
         class: "!w-[240px]",
         rangeSeparator: "~",
-        startPlaceholder: "开始时间",
-        endPlaceholder: "截止时间",
+        startPlaceholder: t("common.placeholder.start_date"),
+        endPlaceholder: t("common.placeholder.end_date"),
         valueFormat: "YYYY-MM-DD"
       }
     }
   },
-  { prop: "user_name", label: "操作人", minWidth: 80 },
-  { prop: "client_ip", label: "IP 地址", minWidth: 80 },
-  { prop: "location", label: "地区", minWidth: 80 },
-  { prop: "browser_name", label: "浏览器", minWidth: 80 },
-  { prop: "os_name", label: "终端系统", minWidth: 80 },
-  { prop: "cost_time", label: "执行时间(ms)", minWidth: 100, align: "right" },
+  { prop: "user_name", label: t("system.base.log.field.user_name"), minWidth: 80 },
+  { prop: "client_ip", label: t("system.base.log.field.client_ip"), minWidth: 80 },
+  { prop: "location", label: t("system.base.log.field.location"), minWidth: 80 },
+  { prop: "browser_name", label: t("system.base.log.field.browser"), minWidth: 80 },
+  { prop: "os_name", label: t("system.base.log.field.os"), minWidth: 80 },
+  { prop: "cost_time", label: t("system.base.log.field.cost_time"), minWidth: 100, align: "right" },
   {
     prop: "detailAction",
-    label: "操作",
+    label: t("common.field.action"),
     width: 100,
     fixed: "right",
     cellType: "actions",
     actions: [
       {
-        label: "详情",
+        label: t("common.action.view"),
         type: "primary",
         link: true,
         icon: InfoFilled,
@@ -246,7 +269,7 @@ const columns: ColumnProps[] = [
       }
     ]
   }
-];
+]);
 
 /**
  * 请求系统日志列表，并通过 buildPageRequest 统一处理分页参数。
@@ -261,7 +284,6 @@ async function requestBaseLogTable(params: PageBaseLogRequest) {
  */
 function handleOpenDialog(logId?: number) {
   resetDetail();
-  dialog.title = "系统日志详情";
   dialog.visible = true;
   if (!logId) return;