@liujitcn/kratos-uni-app-core 0.1.1 → 0.1.4

package/README.md

@@ -38,7 +38,7 @@ packages/core
 - 页面装配插件在编译配置中移除宿主的原生 `tabBar`，退出后恢复宿主原文件。导航按模块注册的 `viewKey` 解析物理页面，支持业务模块覆盖首页和扩展 tab；引用项目升级 core 包后即可使用相同策略。
 - 按匿名态、登录态缓存导航，并在远端不可用时回退到最近缓存或默认菜单。
 - 统一认证、token、MFA、HTTP、上传、配置、Pinia 和基础页面能力。
-- 提供可复用的 `KratosSettingsPage`，统一语言、MFA、微信设置和退出登录，并允许产品在最上方追加业务设置。
+- 提供可复用的 `KratosSettingsPage`，统一账户安全、语言、主题外观、MFA、微信设置和退出登录，并允许产品在最上方或账户安全分组追加业务设置。
 - 公开通用密码弹窗、MFA 绑定面板与恢复码弹窗，供登录页和业务模块复用同一套绑定界面。
 - 登录阶段支持 TOTP、WebAuthn 和一次性恢复码校验；WebAuthn 编解码封装在 `src/utils/webauthn.ts`。
 - 构建时扫描模块 `src/views/**/*.vue`，逐文件合并模块 static，生成宿主页并在退出时按事务精确恢复。
@@ -100,7 +100,7 @@ const combinedAction: KratosNavBarAction = { icon: 'history', label: '历史', d
 
 ## 公共设置页
 
-产品设置页通过公开子路径引用 `KratosSettingsPage`。`extensions` 是唯一业务扩展插槽，固定直接渲染在页面视口最上方；没有传入内容时不会生成容器或额外间距。
+产品设置页通过公开子路径引用 `KratosSettingsPage`。`extensions` 用于页面最上方扩展，`security` 用于账户安全分组内扩展；没有传入内容时不会生成容器或额外间距。
 
 ```vue
 <script setup lang="ts">
@@ -116,7 +116,7 @@ import KratosSettingsPage from '@liujitcn/kratos-uni-app-core/components/KratosS
 </template>
 ```
 
-扩展内容由产品模块自行组织完整卡片。页面顺序固定为业务扩展、MFA 与语言、微信设置、退出登录；产品模块可以注册自己的物理页面，并通过后注册的 `SETTINGS` viewKey 覆盖 system 默认包装页。
+扩展内容由产品模块自行组织完整卡片。页面顺序固定为业务扩展、账户安全、外观（主题与语言）、微信设置、退出登录；产品模块可以注册自己的物理页面，并通过后注册的 `SETTINGS` viewKey 覆盖 system 默认包装页。
 
 构建与验证命令见 [workspace 文档](../../README.md)。
 

package/dist/module.mjs

@@ -142,7 +142,7 @@ var zh_CN_default = {
   "core.settings.feedback": "\u95EE\u9898\u53CD\u9988",
   "core.settings.section_appearance": "\u5916\u89C2",
   "core.settings.section_security": "\u8D26\u6237\u5B89\u5168",
-  "core.settings.section_more": "\u66F4\u591A \xB7 \u5C0F\u7A0B\u5E8F\u7AEF",
+  "core.settings.section_more": "\u66F4\u591A\u670D\u52A1",
   "core.settings.logout_confirm": "\u662F\u5426\u9000\u51FA\u767B\u5F55\uFF1F",
   "core.settings.logout_failed": "\u9000\u51FA\u767B\u5F55\u5931\u8D25",
   "core.settings.mfa_bind_success": "\u591A\u56E0\u7D20\u8BA4\u8BC1\u7ED1\u5B9A\u6210\u529F",
@@ -290,7 +290,7 @@ var en_US_default = {
   "core.settings.feedback": "Feedback",
   "core.settings.section_appearance": "Appearance",
   "core.settings.section_security": "Account security",
-  "core.settings.section_more": "More \xB7 Mini Program",
+  "core.settings.section_more": "More Services",
   "core.settings.logout_confirm": "Log out now?",
   "core.settings.logout_failed": "Logout failed",
   "core.settings.mfa_bind_success": "Multi-factor authentication enabled",
@@ -438,7 +438,7 @@ var ja_JP_default = {
   "core.settings.feedback": "\u554F\u984C\u306E\u30D5\u30A3\u30FC\u30C9\u30D0\u30C3\u30AF",
   "core.settings.section_appearance": "\u5916\u89B3",
   "core.settings.section_security": "\u30A2\u30AB\u30A6\u30F3\u30C8\u30BB\u30AD\u30E5\u30EA\u30C6\u30A3",
-  "core.settings.section_more": "\u305D\u306E\u4ED6\u30FB\u30DF\u30CB\u30D7\u30ED\u30B0\u30E9\u30E0",
+  "core.settings.section_more": "\u305D\u306E\u4ED6\u306E\u30B5\u30FC\u30D3\u30B9",
   "core.settings.logout_confirm": "\u30ED\u30B0\u30A2\u30A6\u30C8\u3057\u307E\u3059\u304B?",
   "core.settings.logout_failed": "\u30ED\u30B0\u30A2\u30A6\u30C8\u306B\u5931\u6557\u3057\u307E\u3057\u305F",
   "core.settings.mfa_bind_success": "\u591A\u8981\u7D20\u8A8D\u8A3C\u3092\u6709\u52B9\u306B\u3057\u307E\u3057\u305F",
@@ -586,7 +586,7 @@ var zh_TW_default = {
   "core.settings.feedback": "\u554F\u984C\u53CD\u994B",
   "core.settings.section_appearance": "\u5916\u89C0",
   "core.settings.section_security": "\u5E33\u6236\u5B89\u5168",
-  "core.settings.section_more": "\u66F4\u591A\u30FB\u5C0F\u7A0B\u5F0F\u7AEF",
+  "core.settings.section_more": "\u66F4\u591A\u670D\u52D9",
   "core.settings.logout_confirm": "\u662F\u5426\u9000\u51FA\u767B\u5165\uFF1F",
   "core.settings.logout_failed": "\u9000\u51FA\u767B\u5165\u5931\u6557",
   "core.settings.mfa_bind_success": "\u591A\u56E0\u7D20\u8A8D\u8B49\u7D81\u5B9A\u6210\u529F",

package/package.json

@@ -7,7 +7,7 @@
     "type": "git",
     "url": "git@github.com:liujitcn/kratos-admin.git"
   },
-  "version": "0.1.1",
+  "version": "0.1.4",
   "type": "module",
   "files": [
     "dist",

package/src/api/base/v1/account.ts

@@ -0,0 +1,38 @@
+import { http } from '../../../utils/http'
+import type {
+  AccountService,
+  CurrentPasswordPolicy,
+  GetCurrentPasswordPolicyRequest,
+  UpdateUserPasswordRequest,
+} from '../../../rpc/base/v1/account'
+import type { Empty } from '../../../rpc/google/protobuf/empty'
+
+const ACCOUNT_URL = '/v1/base/account'
+
+/** 账户安全公共服务。 */
+export class AccountServiceImpl implements AccountService {
+  /** 获取当前用户生效的密码策略。 */
+  GetCurrentPasswordPolicy(
+    request: GetCurrentPasswordPolicyRequest,
+  ): Promise<CurrentPasswordPolicy> {
+    return http<CurrentPasswordPolicy>({
+      url: `${ACCOUNT_URL}/password-policy`,
+      method: 'GET',
+      authMode: 'required',
+      data: request,
+    })
+  }
+
+  /** 修改当前用户密码。 */
+  UpdateUserPassword(request: UpdateUserPasswordRequest): Promise<Empty> {
+    return http<Empty>({
+      url: `${ACCOUNT_URL}/password`,
+      method: 'PUT',
+      authMode: 'required',
+      data: request.user_password,
+    })
+  }
+}
+
+/** 当前用户账户安全公共服务实例。 */
+export const defAccountService = new AccountServiceImpl()

package/src/components/KratosSettingsPage.vue

@@ -13,6 +13,8 @@ defineOptions({ name: 'KratosSettingsPage' })
 defineSlots<{
   /** 在所有公共设置卡片之前渲染的业务扩展内容。 */
   extensions?: () => unknown
+  /** 在账户安全分组中 MFA 卡片之后渲染的业务扩展内容。 */
+  security?: () => unknown
 }>()
 
 const userStore = useUserStore()
@@ -202,21 +204,6 @@ const onLogout = () => {
     <slot name="extensions" />
     <KratosNavBar :title="t('core.settings.title')" />
     <view class="settings-content">
-      <view class="k-set-cat">{{ t('core.settings.section_appearance') }}</view>
-      <picker :range="themeModeLabels" :value="themeModeIndex" @change="onThemeModeChange">
-        <view class="k-set-row k-set-row--arrow">
-          <view class="k-set-row__lead">
-            <view class="k-set-row__icon">
-              <image class="settings-row__icon" :src="settingsIcons.theme" mode="aspectFit" />
-            </view>
-            <text class="k-set-row__title">{{ t('core.settings.theme') }}</text>
-          </view>
-          <text class="k-set-row__value settings-row__value">{{
-            themeModeLabels[themeModeIndex]
-          }}</text>
-        </view>
-      </picker>
-
       <view class="k-set-cat">{{ t('core.settings.section_security') }}</view>
       <view v-if="userStore.isAuthenticated()" class="k-set-row k-set-row--arrow" @tap="onMfaTap">
         <view class="k-set-row__lead">
@@ -231,6 +218,22 @@ const onLogout = () => {
           >{{ mfaStatusText }}</text
         >
       </view>
+      <slot name="security" />
+
+      <view class="k-set-cat">{{ t('core.settings.section_appearance') }}</view>
+      <picker :range="themeModeLabels" :value="themeModeIndex" @change="onThemeModeChange">
+        <view class="k-set-row k-set-row--arrow">
+          <view class="k-set-row__lead">
+            <view class="k-set-row__icon">
+              <image class="settings-row__icon" :src="settingsIcons.theme" mode="aspectFit" />
+            </view>
+            <text class="k-set-row__title">{{ t('core.settings.theme') }}</text>
+          </view>
+          <text class="k-set-row__value settings-row__value">{{
+            themeModeLabels[themeModeIndex]
+          }}</text>
+        </view>
+      </picker>
       <picker :range="localeLabels" :value="localeIndex" @change="onLocaleChange">
         <view class="k-set-row k-set-row--arrow">
           <view class="k-set-row__lead">
@@ -301,7 +304,7 @@ const onLogout = () => {
 .settings-page {
   min-height: 100vh;
   box-sizing: border-box;
-  padding: 0 32rpx calc(40rpx + env(safe-area-inset-bottom));
+  padding: 0 20rpx var(--kratos-tab-bar-space, calc(104rpx + env(safe-area-inset-bottom)));
   background: var(--kratos-bg-gradient);
 }
 .settings-content {

package/src/components/KratosTabBar.vue

@@ -89,18 +89,17 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
   --kratos-tab-bar-active-color: var(--kratos-color-primary, #28f0d4);
 
   position: fixed;
-  right: 20rpx;
-  bottom: env(safe-area-inset-bottom);
-  left: 20rpx;
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 999;
   display: flex;
   box-sizing: border-box;
-  height: 104rpx;
+  height: var(--kratos-tab-bar-space, calc(104rpx + env(safe-area-inset-bottom)));
   padding: 0 8rpx;
-  border: 1rpx solid var(--kratos-color-border-accent, rgba(120, 230, 215, 0.16));
-  border-radius: 30rpx;
-  background: var(--kratos-dock-bg, rgba(10, 18, 30, 0.72));
-  box-shadow: 0 12rpx 32rpx rgba(0, 0, 0, 0.2);
+  border-top: 1rpx solid var(--kratos-color-border-accent, rgba(120, 230, 215, 0.16));
+  background: var(--kratos-color-surface-solid, #070d18);
+  box-shadow: 0 -8rpx 24rpx rgba(0, 0, 0, 0.12);
 }
 .kratos-tab-bar__item {
   position: relative;
@@ -109,7 +108,7 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
   align-items: center;
   justify-content: center;
   flex-direction: column;
-  height: 100%;
+  height: 104rpx;
   padding: 10rpx 0 8rpx;
   box-sizing: border-box;
   color: var(--kratos-tab-bar-color);
@@ -153,7 +152,7 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
   height: 10rpx;
   border-right: 2rpx solid var(--kratos-tab-bar-color);
   border-bottom: 2rpx solid var(--kratos-tab-bar-color);
-  background: var(--kratos-dock-bg, rgba(10, 18, 30, 0.72));
+  background: var(--kratos-color-surface-solid, #070d18);
   content: '';
   transform: rotate(45deg);
 }
@@ -186,7 +185,7 @@ const messageBadge = useAppMenuBadge('MESSAGE_INBOX')
   width: 16rpx;
   height: 16rpx;
   box-sizing: border-box;
-  border: 2rpx solid var(--kratos-dock-bg, rgba(10, 18, 30, 0.72));
+  border: 2rpx solid var(--kratos-color-surface-solid, #070d18);
   border-radius: 50%;
   background: var(--kratos-color-danger, #ff4d6d);
   box-shadow: 0 0 12rpx var(--kratos-color-danger, #ff4d6d);

package/src/locales/en-US.json

@@ -115,7 +115,7 @@
   "core.settings.feedback": "Feedback",
   "core.settings.section_appearance": "Appearance",
   "core.settings.section_security": "Account security",
-  "core.settings.section_more": "More · Mini Program",
+  "core.settings.section_more": "More Services",
   "core.settings.logout_confirm": "Log out now?",
   "core.settings.logout_failed": "Logout failed",
   "core.settings.mfa_bind_success": "Multi-factor authentication enabled",

package/src/locales/ja-JP.json

@@ -115,7 +115,7 @@
   "core.settings.feedback": "問題のフィードバック",
   "core.settings.section_appearance": "外観",
   "core.settings.section_security": "アカウントセキュリティ",
-  "core.settings.section_more": "その他・ミニプログラム",
+  "core.settings.section_more": "その他のサービス",
   "core.settings.logout_confirm": "ログアウトしますか?",
   "core.settings.logout_failed": "ログアウトに失敗しました",
   "core.settings.mfa_bind_success": "多要素認証を有効にしました",

package/src/locales/zh-CN.json

@@ -115,7 +115,7 @@
   "core.settings.feedback": "问题反馈",
   "core.settings.section_appearance": "外观",
   "core.settings.section_security": "账户安全",
-  "core.settings.section_more": "更多 · 小程序端",
+  "core.settings.section_more": "更多服务",
   "core.settings.logout_confirm": "是否退出登录？",
   "core.settings.logout_failed": "退出登录失败",
   "core.settings.mfa_bind_success": "多因素认证绑定成功",

package/src/locales/zh-TW.json

@@ -115,7 +115,7 @@
   "core.settings.feedback": "問題反饋",
   "core.settings.section_appearance": "外觀",
   "core.settings.section_security": "帳戶安全",
-  "core.settings.section_more": "更多・小程式端",
+  "core.settings.section_more": "更多服務",
   "core.settings.logout_confirm": "是否退出登入？",
   "core.settings.logout_failed": "退出登入失敗",
   "core.settings.mfa_bind_success": "多因素認證綁定成功",

package/src/navigation.ts

@@ -125,6 +125,16 @@ const createDefaultMenus = (): AppMenu[] => [
     access: 'AUTHENTICATED',
     inTabBar: false,
   },
+  {
+    id: 99090400,
+    parentId: 99090000,
+    name: 'AppPassword',
+    path: 'app/password',
+    viewKey: 'PASSWORD',
+    title: t('system.settings.password_title'),
+    access: 'AUTHENTICATED',
+    inTabBar: false,
+  },
   {
     id: 99090200,
     parentId: 99090000,
@@ -175,6 +185,7 @@ const pageTitleKeys: Record<string, string> = {
   'pagesMember/message/detail': 'system.notification.title',
   'pagesMember/message/index': 'system.notification.title',
   'pagesMember/profile/profile': 'system.profile.title',
+  'pagesMember/password/password': 'system.settings.password_title',
   'pagesMember/settings/settings': 'core.settings.title',
 }
 
@@ -182,6 +193,7 @@ const fallbackMenuTitleKeys: Record<string, string> = {
   HOME: 'core.navigation.home',
   MESSAGE_INBOX: 'core.navigation.message',
   PROFILE_HOME: 'core.navigation.my',
+  PASSWORD: 'system.settings.password_title',
 }
 
 /** 替换导航远端适配器，供宿主接入自定义契约。 */

package/src/rpc/base/v1/account.ts

@@ -0,0 +1,49 @@
+// Code generated by protoc-gen-ts_proto. DO NOT EDIT.
+// versions:
+//   protoc-gen-ts_proto  v2.12.1
+//   protoc               unknown
+// source: base/v1/account.proto
+
+/* eslint-disable */
+import type { SecretCrypto } from "../../common/v1/types";
+import type { Empty } from "../../google/protobuf/empty";
+
+/** 获取当前用户密码策略请求参数。 */
+export interface GetCurrentPasswordPolicyRequest {
+}
+
+/** 当前用户生效的密码策略。 */
+export interface CurrentPasswordPolicy {
+  /** 密码最小长度 */
+  min_length: number;
+  /** 密码至少满足的字符类别数量 */
+  min_complexity_classes: number;
+  /** 禁止重复使用的历史密码数量 */
+  history_count: number;
+  /** 密码有效期天数 */
+  max_age_days: number;
+}
+
+/** 更新当前用户密码请求参数。 */
+export interface UpdateUserPasswordRequest {
+  /** 当前用户密码 */
+  user_password: UserPasswordForm | undefined;
+}
+
+/** 当前用户密码表单。 */
+export interface UserPasswordForm {
+  /** 原密码 */
+  old_pwd:
+    | SecretCrypto
+    | undefined;
+  /** 新密码 */
+  new_pwd: SecretCrypto | undefined;
+}
+
+/** Base 账户安全服务。 */
+export interface AccountService {
+  /** 获取当前用户生效的密码策略。 */
+  GetCurrentPasswordPolicy(request: GetCurrentPasswordPolicyRequest): Promise<CurrentPasswordPolicy>;
+  /** 修改当前用户密码。 */
+  UpdateUserPassword(request: UpdateUserPasswordRequest): Promise<Empty>;
+}

package/src/styles/base.scss

@@ -1,6 +1,18 @@
 @use './theme.scss';
 @use './components.scss';
 
+html,
+body,
+#app,
+uni-app,
+uni-page,
+uni-page-wrapper,
+uni-page-body,
+page {
+  min-height: 100%;
+  background-color: var(--kratos-color-background, #eef3f8);
+}
+
 page,
 body,
 uni-page-body {
@@ -64,6 +76,49 @@ html.theme-dark page {
   background-color: #060a12;
 }
 
+html .uni-modal {
+  background-color: var(--kratos-color-surface-solid, #ffffff);
+  color: var(--kratos-color-text, #102232);
+  font-family: var(--kratos-font-sans, sans-serif);
+}
+
+html .uni-modal__hd {
+  padding: 16px 24px 8px;
+}
+
+html .uni-modal__title {
+  color: var(--kratos-color-text, #102232);
+  font-size: 18px;
+  line-height: 25px;
+}
+
+html .uni-modal__bd {
+  min-height: 40px;
+  padding: 8px 24px 16px;
+  color: var(--kratos-color-text-muted, #5a7083);
+  font-size: 15px;
+  line-height: 21px;
+}
+
+html .uni-modal__ft {
+  font-size: 18px;
+  line-height: 48px;
+}
+
+html .uni-modal__ft::after,
+html .uni-modal__btn::after {
+  border-color: var(--kratos-color-border, #e3eaf2);
+  color: var(--kratos-color-border, #e3eaf2);
+}
+
+html .uni-modal__btn_primary {
+  color: var(--kratos-color-primary, #039e8c) !important;
+}
+
+html .uni-modal__btn_default {
+  color: var(--kratos-color-text-muted, #5a7083) !important;
+}
+
 html.theme-dark .uni-modal {
   background-color: #070d18;
 }

package/src/styles/components.scss

@@ -529,11 +529,10 @@
  * ============================================================ */
 .k-set-cat {
   margin: 32rpx 4rpx 20rpx;
-  font-size: 21rpx;
-  letter-spacing: 2rpx;
-  color: var(--kratos-color-text-dim);
-  font-family: var(--kratos-font-mono);
-  text-transform: uppercase;
+  color: var(--kratos-color-text-muted);
+  font-size: 26rpx;
+  font-family: var(--kratos-font-sans);
+  font-weight: 700;
 }
 .k-set-row {
   display: flex;

package/src/styles/theme.scss

@@ -29,6 +29,7 @@
   --kratos-color-track: rgba(255, 255, 255, 0.06);
   --kratos-color-mask: rgba(2, 6, 12, 0.55);
   --kratos-dock-bg: rgba(10, 18, 30, 0.72);
+  --kratos-tab-bar-space: calc(104rpx + env(safe-area-inset-bottom));
   --kratos-glow: 0 0 24px rgba(40, 240, 212, 0.35);
   --kratos-glow-soft: 0 0 40px rgba(40, 240, 212, 0.06);
   --kratos-font-sans:
@@ -63,6 +64,7 @@
   --kratos-color-track: #e8eef5;
   --kratos-color-mask: rgba(16, 34, 50, 0.45);
   --kratos-dock-bg: rgba(255, 255, 255, 0.82);
+  --kratos-tab-bar-space: calc(104rpx + env(safe-area-inset-bottom));
   --kratos-glow: 0 10px 26px rgba(0, 120, 110, 0.14);
   --kratos-glow-soft: none;
   --kratos-font-sans:

package/src/views/pages/login/login.vue

@@ -1167,7 +1167,7 @@ onUnload(() => {
   flex-direction: column;
   justify-content: center;
   min-height: 100vh;
-  padding: 48rpx 40rpx calc(56rpx + env(safe-area-inset-bottom));
+  padding: 48rpx 20rpx calc(56rpx + env(safe-area-inset-bottom));
   background: var(--kratos-bg-gradient);
   box-sizing: border-box;
 }
@@ -1183,7 +1183,7 @@ onUnload(() => {
   align-items: center;
   justify-content: space-between;
   height: 44px;
-  padding: env(safe-area-inset-top) 28rpx 0;
+  padding: env(safe-area-inset-top) 20rpx 0;
   box-sizing: content-box;
 }