@liujitcn/kratos-admin-system 0.0.29 → 0.0.31

package/dist/package/src/api/system/oauth_client.ts

@@ -0,0 +1,102 @@
+import service from "@liujitcn/kratos-admin-core/request";
+import type {
+  CreateOauthClientRequest,
+  DeleteOauthClientRequest,
+  GetOauthClientCredentialsRequest,
+  GetOauthClientRequest,
+  OauthClientCredentials,
+  OauthClientForm,
+  OauthClientService,
+  OptionOauthClientApiRequest,
+  OptionOauthClientApiResponse,
+  PageOauthClientRequest,
+  PageOauthClientResponse,
+  RotateOauthClientCredentialsRequest,
+  SetOauthClientStatusRequest,
+  UpdateOauthClientRequest
+} from "@liujitcn/kratos-admin-system/rpc/system/admin/v1/oauth_client";
+import type { Empty } from "@liujitcn/kratos-admin-system/rpc/google/protobuf/empty";
+
+const OAUTH_CLIENT_URL = "/v1/admin/base/oauth-client";
+
+/** 开放授权客户端管理服务实现。 */
+export class OauthClientServiceImpl implements OauthClientService {
+  /** 查询可授权的开发接口。 */
+  OptionOauthClientApi(request: OptionOauthClientApiRequest): Promise<OptionOauthClientApiResponse> {
+    return service<OptionOauthClientApiRequest, OptionOauthClientApiResponse>({
+      url: `${OAUTH_CLIENT_URL}/api`,
+      method: "get",
+      params: request
+    });
+  }
+
+  /** 查询开放授权客户端分页列表。 */
+  PageOauthClient(request: PageOauthClientRequest): Promise<PageOauthClientResponse> {
+    return service<PageOauthClientRequest, PageOauthClientResponse>({
+      url: OAUTH_CLIENT_URL,
+      method: "get",
+      params: request
+    });
+  }
+
+  /** 查询开放授权客户端详情。 */
+  GetOauthClient(request: GetOauthClientRequest): Promise<OauthClientForm> {
+    return service<GetOauthClientRequest, OauthClientForm>({
+      url: `${OAUTH_CLIENT_URL}/${request.id}`,
+      method: "get"
+    });
+  }
+
+  /** 查询开放授权客户端非敏感凭据元数据。 */
+  GetOauthClientCredentials(request: GetOauthClientCredentialsRequest): Promise<OauthClientCredentials> {
+    return service<GetOauthClientCredentialsRequest, OauthClientCredentials>({
+      url: `${OAUTH_CLIENT_URL}/${request.id}/credentials`,
+      method: "get"
+    });
+  }
+
+  /** 轮换开放授权客户端凭据并一次性返回新值。 */
+  RotateOauthClientCredentials(request: RotateOauthClientCredentialsRequest): Promise<OauthClientCredentials> {
+    return service<RotateOauthClientCredentialsRequest, OauthClientCredentials>({
+      url: `${OAUTH_CLIENT_URL}/${request.id}/credentials/rotate`,
+      method: "post"
+    });
+  }
+
+  /** 创建开放授权客户端。 */
+  CreateOauthClient(request: CreateOauthClientRequest): Promise<Empty> {
+    return service<OauthClientForm | undefined, Empty>({
+      url: OAUTH_CLIENT_URL,
+      method: "post",
+      data: request.oauth_client
+    });
+  }
+
+  /** 更新开放授权客户端。 */
+  UpdateOauthClient(request: UpdateOauthClientRequest): Promise<Empty> {
+    return service<OauthClientForm | undefined, Empty>({
+      url: `${OAUTH_CLIENT_URL}/${request.oauth_client?.id ?? ""}`,
+      method: "put",
+      data: request.oauth_client
+    });
+  }
+
+  /** 删除开放授权客户端。 */
+  DeleteOauthClient(request: DeleteOauthClientRequest): Promise<Empty> {
+    return service<DeleteOauthClientRequest, Empty>({
+      url: `${OAUTH_CLIENT_URL}/${request.id}`,
+      method: "delete"
+    });
+  }
+
+  /** 设置开放授权客户端状态。 */
+  SetOauthClientStatus(request: SetOauthClientStatusRequest): Promise<Empty> {
+    return service<SetOauthClientStatusRequest, Empty>({
+      url: `${OAUTH_CLIENT_URL}/${request.id}/status`,
+      method: "put",
+      data: request
+    });
+  }
+}
+
+export const defOauthClientService = new OauthClientServiceImpl();

package/dist/package/src/components/AuditLogTable.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="table-box">
+    <ProTable ref="proTable" row-key="id" :columns="resolvedColumns" :request-api="requestTable" />
+
+    <ProDialog v-model="dialog.visible" :title="config.detailTitle" width="1280px" @close="handleCloseDialog">
+      <el-descriptions border :column="2" class="detail-container">
+        <el-descriptions-item v-for="field in config.detailFields" :key="field.key" :label="field.label" :span="field.span ?? 1">
+          <pre v-if="field.code" class="code-block">{{ formatField(field) }}</pre>
+          <span v-else>{{ formatField(field) }}</span>
+        </el-descriptions-item>
+      </el-descriptions>
+
+      <template #footer>
+        <el-button @click="handleCloseDialog">{{ config.closeText }}</el-button>
+      </template>
+    </ProDialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, reactive, ref, unref } from "vue";
+import type { ColumnProps, ProTableInstance } from "@liujitcn/kratos-admin-core/components/ProTable/interface";
+import ProTable from "@liujitcn/kratos-admin-core/components/ProTable";
+import ProDialog from "@liujitcn/kratos-admin-core/components/Dialog/ProDialog.vue";
+import { buildPageRequest } from "@liujitcn/kratos-admin-core/table";
+import { formatJson } from "@liujitcn/kratos-admin-core/format";
+
+/** 审计详情字段配置。 */
+export interface AuditLogDetailField {
+  /** 详情对象中对应的字段名。 */
+  key: string;
+  /** 字段在详情弹窗中的显示名称。 */
+  label: string;
+  /** 字段占用的描述列数，未设置时使用一列。 */
+  span?: number;
+  /** 是否按格式化 JSON 的代码块展示。 */
+  code?: boolean;
+}
+
+/** 审计列表页面配置。 */
+export interface AuditLogTableConfig {
+  /** 审计列表表格的列定义。 */
+  columns: ColumnProps[];
+  /** 详情弹窗标题。 */
+  detailTitle: string;
+  /** 详情弹窗关闭按钮文案。 */
+  closeText: string;
+  /** 详情字段和展示格式定义。 */
+  detailFields: AuditLogDetailField[];
+  /** 分页查询函数，返回列表和总数。 */
+  request: (params: Record<string, unknown>) => Promise<{ list: Record<string, unknown>[]; total: number }>;
+  /** 按日志编号读取详情。 */
+  get: (id: number) => Promise<Record<string, unknown>>;
+}
+
+const props = defineProps<{ config: AuditLogTableConfig }>();
+const proTable = ref<ProTableInstance>();
+const detail = reactive<Record<string, unknown>>({});
+const dialog = reactive({ visible: false });
+const resolvedColumns = computed(() => unref(props.config.columns));
+
+/** 请求审计日志分页数据。 */
+async function requestTable(params: Record<string, unknown>) {
+  const result = await props.config.request(buildPageRequest(params));
+  return { data: { list: result.list, total: result.total } };
+}
+
+/** 打开审计详情弹窗。 */
+async function handleOpenDialog(id: number) {
+  const value = await props.config.get(id);
+  Object.keys(detail).forEach(key => delete detail[key]);
+  Object.assign(detail, value);
+  dialog.visible = true;
+}
+
+/** 关闭并清理审计详情弹窗。 */
+function handleCloseDialog() {
+  dialog.visible = false;
+  Object.keys(detail).forEach(key => delete detail[key]);
+}
+
+/** 格式化详情字段，JSON 内容使用统一脱敏展示格式。 */
+function formatField(field: AuditLogDetailField) {
+  const value = detail[field.key];
+  if (value === undefined || value === null || value === "") return "--";
+  if (field.code) return formatJson(String(value));
+  return String(value);
+}
+
+defineExpose({ handleOpenDialog, proTable });
+</script>
+
+<style scoped>
+.detail-container {
+  width: 100%;
+}
+
+.code-block {
+  max-height: 360px;
+  margin: 0;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+</style>

package/dist/package/src/components/Notification.vue

@@ -0,0 +1,196 @@
+<template>
+  <el-popover placement="bottom-end" :width="360" trigger="click" @show="refresh">
+    <template #reference>
+      <el-badge class="notification-trigger" :value="badgeValue" :hidden="unreadTotal === 0" :max="99">
+        <el-icon :size="24"><Bell /></el-icon>
+      </el-badge>
+    </template>
+    <div class="notification-panel">
+      <div class="notification-header">
+        <strong>{{ t("system.notification.title") }}</strong>
+        <el-button link type="primary" @click="markAllRead">{{ t("system.notification.action.mark_all_read") }}</el-button>
+      </div>
+      <div class="notification-list">
+        <button
+          v-for="item in notifications"
+          :key="item.id"
+          class="notification-item"
+          :class="{ 'is-unread': !item.read_at }"
+          type="button"
+          @click="openInbox"
+        >
+          <span class="notification-category-icon" :style="{ color: item.category_color || undefined }" aria-hidden="true">
+            <component :is="resolveNotificationIcon(item.category_icon)" />
+          </span>
+          <span class="notification-status" :style="{ backgroundColor: item.category_color || undefined }" aria-hidden="true"></span>
+          <span class="notification-title">{{ item.title }}</span>
+          <span class="notification-time">{{ item.received_at }}</span>
+        </button>
+        <el-empty v-if="notifications.length === 0" :description="t('system.notification.empty')" :image-size="72" />
+      </div>
+      <el-button class="notification-more" text @click="openInbox">{{ t("system.notification.action.view_all") }}</el-button>
+    </div>
+  </el-popover>
+</template>
+
+<script setup lang="ts">
+import { computed, onBeforeUnmount, onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
+import { t } from "@liujitcn/kratos-admin-core";
+import { defNotificationService } from "@liujitcn/kratos-admin-system/api/base/notification";
+import { subscribeSseEvent, type SseStop } from "@liujitcn/kratos-admin-system/api/base/sse";
+import type { Notification } from "@liujitcn/kratos-admin-system/rpc/base/v1/notification";
+import { NotificationView } from "@liujitcn/kratos-admin-system/rpc/base/v1/notification";
+
+const router = useRouter();
+const unreadTotal = ref(0);
+const latestDeliveryID = ref(0);
+const notifications = ref<Notification[]>([]);
+let stopSse: SseStop | undefined;
+
+const badgeValue = computed(() => Math.min(unreadTotal.value, 99));
+const notificationIcons = {
+  Bell,
+  Calendar,
+  ChatDotRound,
+  CircleCheckFilled,
+  CollectionTag,
+  DataAnalysis,
+  InfoFilled,
+  List,
+  Lock,
+  Message,
+  Promotion,
+  Setting,
+  User,
+  WarningFilled
+};
+
+onMounted(() => {
+  void refresh();
+  stopSse = subscribeSseEvent(
+    { stream: "base.notification", channel_id: undefined },
+    "inbox.changed",
+    raw => {
+      try {
+        return JSON.parse(raw) as Record<string, unknown>;
+      } catch {
+        return null;
+      }
+    },
+    () => void refresh()
+  );
+});
+
+onBeforeUnmount(() => stopSse?.());
+
+/** 刷新未读汇总和最近消息。 */
+async function refresh() {
+  const [summary, page] = await Promise.all([
+    defNotificationService.GetNotificationSummary({}),
+    defNotificationService.PageNotification({ view: NotificationView.NOTIFICATION_VIEW_INBOX, category_id: undefined, priority: undefined, cursor_id: 0, page_num: 1, page_size: 5 })
+  ]);
+  unreadTotal.value = summary.unread_total;
+  latestDeliveryID.value = summary.latest_delivery_id;
+  notifications.value = page.notifications;
+}
+
+/** 标记全部消息为已读。 */
+async function markAllRead() {
+  if (!latestDeliveryID.value) return;
+  await defNotificationService.MarkAllNotificationRead({ before_delivery_id: latestDeliveryID.value });
+  await refresh();
+}
+
+/** 打开完整收件箱。 */
+function openInbox() {
+  void router.push({ name: "NotificationInbox" });
+}
+
+/** 解析收件箱分类图标，兼容历史数据中的未知图标名。 */
+function resolveNotificationIcon(icon: string) {
+  return notificationIcons[icon as keyof typeof notificationIcons] ?? CollectionTag;
+}
+</script>
+
+<style scoped lang="scss">
+.notification-trigger {
+  display: inline-flex;
+  width: 24px;
+  height: 24px;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+
+.notification-panel {
+  min-height: 160px;
+}
+
+.notification-list {
+  max-height: min(440px, calc(100vh - 240px));
+  overflow-y: auto;
+  overscroll-behavior: contain;
+}
+
+.notification-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.notification-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 10px 0;
+  border: 0;
+  border-bottom: 1px solid var(--el-border-color-lighter);
+  background: transparent;
+  color: var(--el-text-color-primary);
+  cursor: pointer;
+  text-align: left;
+}
+
+.notification-status {
+  width: 7px;
+  height: 7px;
+  flex: 0 0 7px;
+  border-radius: 50%;
+  background: var(--el-color-primary);
+  visibility: hidden;
+}
+
+.notification-category-icon {
+  display: inline-flex;
+  flex: 0 0 18px;
+  align-items: center;
+  justify-content: center;
+  font-size: 17px;
+}
+
+.notification-item.is-unread .notification-status {
+  visibility: visible;
+}
+
+.notification-title {
+  min-width: 0;
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.notification-time {
+  margin-left: 12px;
+  color: var(--el-text-color-secondary);
+  font-size: 12px;
+}
+
+.notification-more {
+  width: 100%;
+  margin-top: 8px;
+}
+</style>

package/dist/package/src/components/auditLog.ts

@@ -0,0 +1,46 @@
+import type { ColumnProps, EnumProps, SearchProps } from "@liujitcn/kratos-admin-core/components/ProTable/interface";
+
+/** 根据枚举值生成表格筛选项。 */
+export function createAuditEnumOptions(items: Array<[number, string]>): EnumProps[] {
+  return items.map(([value, label]) => ({ value, label }));
+}
+
+/** 根据枚举值查找展示文案。 */
+export function auditEnumLabel(options: EnumProps[], value: unknown): string {
+  return options.find(item => item.value === value)?.label ?? String(value ?? "--");
+}
+
+/** 创建审计日志时间范围筛选项。 */
+export function auditDateSearch(t: (key: string) => string): SearchProps {
+  return {
+    el: "date-picker",
+    props: {
+      type: "daterange",
+      editable: false,
+      class: "!w-[240px]",
+      rangeSeparator: "~",
+      startPlaceholder: t("common.placeholder.start_date"),
+      endPlaceholder: t("common.placeholder.end_date"),
+      valueFormat: "YYYY-MM-DD"
+    }
+  };
+}
+
+/** 创建审计日志详情按钮列。 */
+export function auditDetailColumn(label: string, onClick: (id: number) => void): ColumnProps {
+  return {
+    prop: "detailAction",
+    label,
+    width: 100,
+    fixed: "right",
+    cellType: "actions",
+    actions: [
+      {
+        label,
+        type: "primary",
+        link: true,
+        onClick: scope => onClick(Number(scope.row.id))
+      }
+    ]
+  };
+}

package/dist/package/src/locales/README.md

@@ -1,12 +1,13 @@
 # 管理端 System 语言包
 
-本目录提供 System 管理业务模块的页面、AI、个人中心、基础资料和代码生成等业务文案。语言包由同级 `../module.ts` 导入，随 `systemAdminModule` 注册；管理端启动时由 core 的 `registerLocaleMessages` 合并，System 页面和组件通过 `t()` 或 `useLocaleStore()` 使用 `system.*` 键。
+本目录提供 System 管理业务模块的页面、AI、个人中心安全设置、开放授权客户端、基础资料和代码生成等业务文案。语言包由同级 `../module.ts` 导入，随 `systemAdminModule` 注册；管理端启动时由 core 的 `registerLocaleMessages` 合并，System 页面和组件通过 `t()` 或 `useLocaleStore()` 使用 `system.*` 键。
 
 | 文件 | 用途 | 使用位置 |
 | --- | --- | --- |
 | `zh-CN.json` | System 模块简体中文固定 UI 默认语言包，也是所有语言键集合和占位符校验基准。 | 管理端固定文案默认语言及缺失翻译回退。 |
 | `zh-TW.json` | System 模块繁体中文语言包。 | 管理端切换为繁体中文时由 Vue I18n 使用。 |
 | `en-US.json` | System 模块英文语言包。 | 管理端切换为英文时由 Vue I18n 使用。 |
+| `ja-JP.json` | System 模块日文语言包。 | 管理端切换为日文时由 Vue I18n 使用。 |
 
 ## 命名空间与使用位置
 
@@ -16,6 +17,7 @@
 | `system.ai.*` | AI 会话、消息流、重试和错误提示。 | `src/views/ai/**`、`src/api/base/ai_message.ts`。 |
 | `system.profile.*` | 个人资料、安全设置和用户中心导航。 | `src/views/profile/**`、`src/module.ts` 的用户菜单。 |
 | `system.base.*` | 区域、配置、部门、字典、岗位、角色、租户、用户等基础管理页面。 | `src/views/base/**`。 |
+| `system.base.oauth_client.*` | 开放授权客户端字段、凭据和 API 选择。 | `src/views/base/oauth-client/**`。 |
 | `system.code.gen.*` | 代码生成配置、预览、列配置和多语言编辑。 | `src/views/tool/code-gen/**`。 |
 | `system.i18n.*` | 动态翻译编辑、草稿生成和语言包状态。 | `src/components/DynamicI18nEditor.vue`、代码生成语言编辑组件。 |
 
@@ -23,4 +25,4 @@
 
 语言键按文案归属使用 `common.` 或 `system.` 命名空间；语言包保持标准 JSON，不在文件内写注释。
 
-新增语言的完整文件清单和迁移流程见[国际化语言扩展指南](../../../../../../docs/国际化语言扩展指南.md)。
+新增语言的完整文件清单和迁移流程见[国际化语言扩展指南](../../../../../../../docs/国际化语言扩展指南.md)。