yingzios-platform-frontend-devtools 1.0.1

package/README.md

@@ -0,0 +1,77 @@
+# frontend-devtools
+
+开发时工具库，提供微应用本地独立运行所需的组件和工具。
+
+## 使用场景
+
+- 微应用本地独立开发时的布局组件
+- 开发调试工具
+- 简化的登录功能
+
+## 重要说明
+
+这个库应该作为 **devDependencies** 使用，**不应包含在生产构建中**。
+
+## 工具函数
+
+> **注意**：`getBasePath`、`getApiBasePath`、`hasSubPath` 已迁移至 `@org/frontend-core`。
+> 本库保留重导出以兼容旧代码，新代码请直接从 `@org/frontend-core` 导入。
+
+## 组件
+
+### StandaloneAppLayout
+
+独立运行模式下的应用布局，自动从 `app-manifest.json` 加载配置并生成侧边栏菜单。
+默认包含登录功能（DevUserMenu）。
+
+```tsx
+import { StandaloneAppLayout } from 'yz-frontend-devtools';
+
+function StandaloneApp() {
+  return (
+    <StandaloneAppLayout>
+      <AppRoutes />
+    </StandaloneAppLayout>
+  );
+}
+```
+
+#### Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| manifestUrl | string | 'app-manifest.json' | manifest 文件路径（相对路径，受 `<base>` 标签影响） |
+| children | ReactNode | - | 子内容 |
+| logo | ReactNode | - | 自定义 Logo |
+| headerRight | ReactNode \| false | DevUserMenu | 顶部右侧自定义内容，设为 false 则不显示 |
+| renderIcon | (iconKey) => ReactNode | - | 自定义图标渲染函数 |
+| apiBasePath | string | '/portal/api' | API 基础路径，用于登录接口 |
+
+### DevUserMenu
+
+开发环境用户菜单组件，提供简化的登录功能。
+
+```tsx
+import { DevUserMenu } from 'yz-frontend-devtools';
+
+function Header() {
+  return (
+    <header>
+      <DevUserMenu apiBasePath="/portal/api" />
+    </header>
+  );
+}
+```
+
+#### 功能特点
+
+- 手机号 + 验证码登录
+- 自动记录上次登录的手机号（localStorage）
+- 验证码默认填写 `1024`（开发环境便捷登录）
+- 登录状态持久化（token 存储在 localStorage）
+
+#### Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| apiBasePath | string | '/portal/api' | API 基础路径 |

package/dist/base-path.d.ts

@@ -0,0 +1,2 @@
+export { getBasePath, getApiBasePath, hasSubPath } from 'yz-frontend-core';
+//# sourceMappingURL=base-path.d.ts.map

package/dist/base-path.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-path.d.ts","sourceRoot":"","sources":["../src/base-path.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/base-path.js

@@ -0,0 +1,2 @@
+// 重导出自 frontend-core，保持向后兼容
+export { getBasePath, getApiBasePath, hasSubPath } from 'yz-frontend-core';

package/dist/components/DevUserMenu/JwtGeneratorModal.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface JwtGeneratorModalProps {
+    onClose: () => void;
+    onSuccess: () => void;
+}
+/**
+ * JWT 生成器对话框
+ *
+ * 用于本地开发时手动签发 JWT Token，无需依赖 portal 网关。
+ */
+export declare function JwtGeneratorModal({ onClose, onSuccess }: JwtGeneratorModalProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=JwtGeneratorModal.d.ts.map

package/dist/components/DevUserMenu/JwtGeneratorModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JwtGeneratorModal.d.ts","sourceRoot":"","sources":["../../../src/components/DevUserMenu/JwtGeneratorModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAKxC,UAAU,sBAAsB;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAsCD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,sBAAsB,qBAuK/E"}

package/dist/components/DevUserMenu/JwtGeneratorModal.js

@@ -0,0 +1,137 @@
+import React, { useState } from 'react';
+import { Form, Input, message } from 'antd';
+import { modalStyles } from './styles';
+import { signJwtHS256, getDefaultJwtPayload } from './jwt-utils';
+const STORAGE_KEY = 'devtools:jwtFormData';
+function getInitialValues() {
+    if (typeof window === 'undefined') {
+        return {
+            payloadText: JSON.stringify(getDefaultJwtPayload(), null, 2),
+            secret: 'this-is-a-secret-key-for-jwt',
+            expiresIn: 86400,
+        };
+    }
+    try {
+        const saved = localStorage.getItem(STORAGE_KEY);
+        if (saved) {
+            const parsed = JSON.parse(saved);
+            // 验证 payload 是否为有效 JSON
+            JSON.parse(parsed.payloadText);
+            return parsed;
+        }
+    }
+    catch {
+        // 解析失败，使用默认值
+    }
+    return {
+        payloadText: JSON.stringify(getDefaultJwtPayload(), null, 2),
+        secret: 'this-is-a-secret-key-for-jwt',
+        expiresIn: 86400,
+    };
+}
+/**
+ * JWT 生成器对话框
+ *
+ * 用于本地开发时手动签发 JWT Token，无需依赖 portal 网关。
+ */
+export function JwtGeneratorModal({ onClose, onSuccess }) {
+    const [form] = Form.useForm();
+    const [loading, setLoading] = useState(false);
+    const handleGenerate = async (values) => {
+        const { payloadText, secret, expiresIn } = values;
+        setLoading(true);
+        try {
+            // 1. 解析 payload
+            const payload = JSON.parse(payloadText);
+            // 2. 生成 JWT
+            const token = await signJwtHS256(payload, secret, expiresIn);
+            // 3. 保存到 localStorage
+            localStorage.setItem('accessToken', token);
+            // 4. 保存用户信息到 localStorage（用于 DevUserMenu 显示）
+            const userInfo = {
+                userId: payload.sub || payload.id,
+                nickname: payload.nickname,
+                avatar: payload.avatar || '',
+                phone: payload.phone,
+            };
+            localStorage.setItem('devtools:userInfo', JSON.stringify(userInfo));
+            // 5. 保存表单数据到 localStorage
+            localStorage.setItem(STORAGE_KEY, JSON.stringify(values));
+            // 6. 显示成功提示并通知父组件
+            message.success('JWT Token 生成成功！2 秒后自动刷新页面...');
+            onSuccess();
+            // 7. 2 秒后自动刷新页面
+            setTimeout(() => {
+                window.location.reload();
+            }, 2000);
+        }
+        catch (err) {
+            console.error('[JwtGeneratorModal] 生成 JWT 失败:', err);
+            message.error(err instanceof Error ? err.message : '生成 JWT 失败，请检查输入');
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    return (React.createElement("div", { style: modalStyles.overlay, onClick: onClose },
+        React.createElement("div", { style: { ...modalStyles.modal, width: '750px', maxWidth: '90vw' }, onClick: (e) => e.stopPropagation() },
+            React.createElement("div", { style: modalStyles.header },
+                React.createElement("h3", { style: modalStyles.title }, "\u672C\u5730\u7B7E\u53D1 JWT Token"),
+                React.createElement("button", { style: modalStyles.closeButton, onClick: onClose }, "\u00D7")),
+            React.createElement(Form, { form: form, layout: "vertical", initialValues: getInitialValues(), onFinish: handleGenerate, style: modalStyles.form },
+                React.createElement(Form.Item, { label: React.createElement("span", null,
+                        "Payload ",
+                        React.createElement("span", { style: { color: '#ff4d4f' } }, "*")), name: "payloadText", rules: [
+                        { required: true, message: '请输入 Payload' },
+                        {
+                            validator: async (_, value) => {
+                                if (!value)
+                                    return;
+                                try {
+                                    const payload = JSON.parse(value);
+                                    // 验证必填字段
+                                    if (!payload.id && !payload.sub) {
+                                        throw new Error('缺少必填字段: id 或 sub（用户ID）');
+                                    }
+                                    const requiredFields = ['aud', 'nickname', 'phone'];
+                                    for (const field of requiredFields) {
+                                        if (!payload[field]) {
+                                            throw new Error(`缺少必填字段: ${field}`);
+                                        }
+                                    }
+                                }
+                                catch (err) {
+                                    if (err instanceof SyntaxError) {
+                                        throw new Error('Payload 格式错误，请输入有效的 JSON');
+                                    }
+                                    throw err;
+                                }
+                            },
+                        },
+                    ], extra: "JSON \u683C\u5F0F\uFF0C\u5FC5\u586B\u5B57\u6BB5\uFF1Aid/sub\uFF08\u7528\u6237ID\uFF09\u3001aud\uFF08\u53D7\u4F17\uFF09\u3001nickname\uFF08\u6635\u79F0\uFF09\u3001phone\uFF08\u624B\u673A\u53F7\uFF09\u3001orgId\uFF08\u7EC4\u7EC7ID\uFF0C\u53EF\u9009\uFF09" },
+                    React.createElement(Input.TextArea, { rows: 8, placeholder: '{"id": "1000000001", "sub": "1000000001", "aud": "internal", ...}', style: {
+                            fontFamily: 'monospace',
+                            fontSize: '13px',
+                        } })),
+                React.createElement(Form.Item, { label: React.createElement("span", null,
+                        "JWT \u5BC6\u94A5\uFF08Secret\uFF09",
+                        React.createElement("span", { style: { color: '#ff4d4f' } }, "*")), name: "secret", rules: [
+                        { required: true, message: '请输入 JWT 密钥' },
+                        { whitespace: true, message: 'JWT 密钥不能为空' },
+                    ], extra: "\u7B7E\u540D\u7B97\u6CD5\uFF1AHS256\uFF08HMAC SHA256\uFF09" },
+                    React.createElement(Input, { placeholder: "your-secret-key" })),
+                React.createElement(Form.Item, { label: React.createElement("span", null,
+                        "\u6709\u6548\u671F\uFF08\u79D2\uFF09",
+                        React.createElement("span", { style: { color: '#ff4d4f' } }, "*")), name: "expiresIn", rules: [
+                        { required: true, message: '请输入有效期' },
+                        { type: 'number', min: 1, message: '有效期必须是正整数' },
+                    ], extra: "\u9ED8\u8BA4 86400 \u79D2\uFF081 \u5929\uFF09" },
+                    React.createElement(Input, { type: "number", placeholder: "86400", min: 1 })),
+                React.createElement("div", { style: modalStyles.tip },
+                    "\uD83D\uDCA1 \u751F\u6210\u7684 Token \u5C06\u4FDD\u5B58\u5230 ",
+                    React.createElement("code", { style: modalStyles.tipCode }, "localStorage.accessToken")),
+                React.createElement("button", { type: "submit", style: {
+                        ...modalStyles.submitButton,
+                        ...(loading ? modalStyles.submitButtonDisabled : {}),
+                    }, disabled: loading }, loading ? '生成中...' : '生成并保存 Token')))));
+}

package/dist/components/DevUserMenu/index.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+export interface DevUserMenuProps {
+    /**
+     * API 基础路径，默认 '/portal/api'
+     */
+    apiBasePath?: string;
+    /**
+     * 是否显示切换组织按钮
+     * @default true
+     */
+    showOrgSwitch?: boolean;
+    /**
+     * 组织切换页面路径
+     * @default '/org-select'
+     */
+    orgSwitchPath?: string;
+}
+/**
+ * 开发环境用户菜单组件
+ *
+ * 提供简化的登录功能，方便本地独立开发调试。
+ * - 手机号 + 验证码登录
+ * - 自动记录上次登录的手机号
+ * - 验证码默认填写 1024
+ */
+export declare function DevUserMenu({ apiBasePath, showOrgSwitch, orgSwitchPath, }: DevUserMenuProps): React.JSX.Element;
+export declare namespace DevUserMenu {
+    var displayName: string;
+}
+export default DevUserMenu;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/DevUserMenu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DevUserMenu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAkBxE,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,WAA2B,EAC3B,aAAoB,EACpB,aAA6B,GAC9B,EAAE,gBAAgB,qBAyIlB;yBA7Ie,WAAW;;;AAwU3B,eAAe,WAAW,CAAC"}

package/dist/components/DevUserMenu/index.js

@@ -0,0 +1,219 @@
+import React, { useState, useEffect, useCallback, useRef } from 'react';
+import { devUserMenuStyles, modalStyles, formGroupStyles } from './styles';
+import { JwtGeneratorModal } from './JwtGeneratorModal';
+const STORAGE_KEYS = {
+    accessToken: 'accessToken',
+    refreshToken: 'refreshToken',
+    lastPhone: 'devtools:lastPhone',
+    userInfo: 'devtools:userInfo',
+};
+/**
+ * 开发环境用户菜单组件
+ *
+ * 提供简化的登录功能，方便本地独立开发调试。
+ * - 手机号 + 验证码登录
+ * - 自动记录上次登录的手机号
+ * - 验证码默认填写 1024
+ */
+export function DevUserMenu({ apiBasePath = '/portal/api', showOrgSwitch = true, orgSwitchPath = '/org-select', }) {
+    const [isLoggedIn, setIsLoggedIn] = useState(false);
+    const [userInfo, setUserInfo] = useState(null);
+    const [showDropdown, setShowDropdown] = useState(false);
+    const [showJwtGenerator, setShowJwtGenerator] = useState(false);
+    const dropdownRef = useRef(null);
+    // 初始化时检查登录状态
+    useEffect(() => {
+        const token = localStorage.getItem(STORAGE_KEYS.accessToken);
+        const savedUserInfo = localStorage.getItem(STORAGE_KEYS.userInfo);
+        if (token && savedUserInfo) {
+            try {
+                setUserInfo(JSON.parse(savedUserInfo));
+                setIsLoggedIn(true);
+            }
+            catch {
+                // 解析失败，清除无效数据
+                clearAuth();
+            }
+        }
+    }, []);
+    // 点击外部关闭下拉菜单
+    useEffect(() => {
+        function handleClickOutside(event) {
+            if (dropdownRef.current &&
+                !dropdownRef.current.contains(event.target)) {
+                setShowDropdown(false);
+            }
+        }
+        document.addEventListener('mousedown', handleClickOutside);
+        return () => document.removeEventListener('mousedown', handleClickOutside);
+    }, []);
+    const clearAuth = useCallback(() => {
+        localStorage.removeItem(STORAGE_KEYS.accessToken);
+        localStorage.removeItem(STORAGE_KEYS.refreshToken);
+        localStorage.removeItem(STORAGE_KEYS.userInfo);
+        setIsLoggedIn(false);
+        setUserInfo(null);
+    }, []);
+    const handleLogout = useCallback(() => {
+        clearAuth();
+        setShowDropdown(false);
+    }, [clearAuth]);
+    const handleJwtGeneratorSuccess = useCallback(() => {
+        // 重新加载用户信息
+        const token = localStorage.getItem(STORAGE_KEYS.accessToken);
+        const savedUserInfo = localStorage.getItem(STORAGE_KEYS.userInfo);
+        if (token && savedUserInfo) {
+            try {
+                setUserInfo(JSON.parse(savedUserInfo));
+                setIsLoggedIn(true);
+                setShowJwtGenerator(false);
+            }
+            catch {
+                clearAuth();
+            }
+        }
+    }, [clearAuth]);
+    const getAvatarContent = () => {
+        if (userInfo?.avatar) {
+            return (React.createElement("img", { src: userInfo.avatar, alt: "avatar", style: devUserMenuStyles.avatarImage }));
+        }
+        if (userInfo?.nickname) {
+            return userInfo.nickname.charAt(0).toUpperCase();
+        }
+        return '?';
+    };
+    const handleSwitchOrganization = useCallback(() => {
+        window.location.href = orgSwitchPath;
+    }, [orgSwitchPath]);
+    return (React.createElement("div", { style: devUserMenuStyles.container, ref: dropdownRef },
+        isLoggedIn ? (React.createElement(React.Fragment, null,
+            React.createElement("button", { style: devUserMenuStyles.avatar, onClick: () => setShowDropdown(!showDropdown), title: userInfo?.nickname || '用户' }, getAvatarContent()),
+            showDropdown && (React.createElement("div", { style: devUserMenuStyles.dropdown },
+                React.createElement("div", { style: devUserMenuStyles.dropdownHeader },
+                    React.createElement("span", { style: devUserMenuStyles.dropdownNickname }, userInfo?.nickname || '未知用户'),
+                    React.createElement("span", { style: devUserMenuStyles.dropdownPhone }, userInfo?.phone)),
+                React.createElement("div", { style: devUserMenuStyles.dropdownDivider }),
+                React.createElement("button", { style: devUserMenuStyles.dropdownItem, onClick: handleLogout }, "\u9000\u51FA\u767B\u5F55"))))) : (React.createElement("button", { style: devUserMenuStyles.loginButton, onClick: () => setShowJwtGenerator(true) }, "\u672C\u5730\u7B7E\u53D1 JWT")),
+        showJwtGenerator && (React.createElement(JwtGeneratorModal, { onClose: () => setShowJwtGenerator(false), onSuccess: handleJwtGeneratorSuccess }))));
+}
+function LoginModal({ apiBasePath, onClose, onSuccess }) {
+    const [phone, setPhone] = useState(() => {
+        return localStorage.getItem(STORAGE_KEYS.lastPhone) || '';
+    });
+    const [code, setCode] = useState('1024');
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const [codeSent, setCodeSent] = useState(false);
+    const [countdown, setCountdown] = useState(0);
+    // 验证码倒计时
+    useEffect(() => {
+        if (countdown > 0) {
+            const timer = setTimeout(() => setCountdown(countdown - 1), 1000);
+            return () => clearTimeout(timer);
+        }
+    }, [countdown]);
+    const sendCode = async () => {
+        if (!phone || phone.length !== 11) {
+            setError('请输入有效的手机号');
+            return;
+        }
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch(`${apiBasePath}/base/sms/send-code`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ phone, action: 'login' }),
+            });
+            const data = await response.json();
+            if (data.code === '000000') {
+                setCodeSent(true);
+                setCountdown(60);
+                // 保存手机号
+                localStorage.setItem(STORAGE_KEYS.lastPhone, phone);
+            }
+            else {
+                setError(data.message || '发送验证码失败');
+            }
+        }
+        catch (err) {
+            setError('网络错误，请稍后重试');
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleLogin = async (e) => {
+        e.preventDefault();
+        if (!phone || !code) {
+            setError('请填写手机号和验证码');
+            return;
+        }
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch(`${apiBasePath}/base/auth/login`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    method: 'phone_sms',
+                    phone,
+                    code,
+                }),
+            });
+            const data = await response.json();
+            if (data.code === '000000' && data.data) {
+                const loginData = data.data;
+                // 保存 token
+                localStorage.setItem(STORAGE_KEYS.accessToken, loginData.accessToken);
+                localStorage.setItem(STORAGE_KEYS.refreshToken, loginData.refreshToken);
+                localStorage.setItem(STORAGE_KEYS.lastPhone, phone);
+                // 构建用户信息
+                const userInfo = {
+                    userId: loginData.userId,
+                    nickname: loginData.nickname || phone,
+                    avatar: loginData.avatar,
+                    phone,
+                };
+                localStorage.setItem(STORAGE_KEYS.userInfo, JSON.stringify(userInfo));
+                onSuccess(userInfo);
+            }
+            else {
+                setError(data.message || '登录失败');
+            }
+        }
+        catch (err) {
+            setError('网络错误，请稍后重试');
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    return (React.createElement("div", { style: modalStyles.overlay, onClick: onClose },
+        React.createElement("div", { style: modalStyles.modal, onClick: (e) => e.stopPropagation() },
+            React.createElement("div", { style: modalStyles.header },
+                React.createElement("h3", { style: modalStyles.title }, "\u5F00\u53D1\u767B\u5F55"),
+                React.createElement("button", { style: modalStyles.closeButton, onClick: onClose }, "\u00D7")),
+            React.createElement("form", { style: modalStyles.form, onSubmit: handleLogin },
+                React.createElement("div", { style: formGroupStyles.group },
+                    React.createElement("label", { style: formGroupStyles.label }, "\u624B\u673A\u53F7"),
+                    React.createElement("input", { type: "tel", style: formGroupStyles.input, value: phone, onChange: (e) => setPhone(e.target.value), placeholder: "\u8BF7\u8F93\u5165\u624B\u673A\u53F7", maxLength: 11, autoComplete: "tel" })),
+                React.createElement("div", { style: formGroupStyles.group },
+                    React.createElement("label", { style: formGroupStyles.label }, "\u9A8C\u8BC1\u7801"),
+                    React.createElement("div", { style: formGroupStyles.inputRow },
+                        React.createElement("input", { type: "text", style: { ...formGroupStyles.input, flex: 1 }, value: code, onChange: (e) => setCode(e.target.value), placeholder: "\u9A8C\u8BC1\u7801", maxLength: 6 }),
+                        React.createElement("button", { type: "button", style: {
+                                ...formGroupStyles.sendButton,
+                                ...(loading || countdown > 0 ? formGroupStyles.sendButtonDisabled : {}),
+                            }, onClick: sendCode, disabled: loading || countdown > 0 }, countdown > 0 ? `${countdown}s` : codeSent ? '重新发送' : '发送验证码'))),
+                error && React.createElement("div", { style: modalStyles.error }, error),
+                React.createElement("div", { style: modalStyles.tip },
+                    "\uD83D\uDCA1 \u5F00\u53D1\u73AF\u5883\u9A8C\u8BC1\u7801\u9ED8\u8BA4\u4E3A ",
+                    React.createElement("code", { style: modalStyles.tipCode }, "1024")),
+                React.createElement("button", { type: "submit", style: {
+                        ...modalStyles.submitButton,
+                        ...(loading ? modalStyles.submitButtonDisabled : {}),
+                    }, disabled: loading }, loading ? '登录中...' : '登录')))));
+}
+DevUserMenu.displayName = 'DevUserMenu';
+export default DevUserMenu;

package/dist/components/DevUserMenu/jwt-utils.d.ts

@@ -0,0 +1,34 @@
+/**
+ * JWT 生成工具（浏览器端实现）
+ * 使用 Web Crypto API 实现 HS256 签名
+ *
+ * JWT Payload 字段说明（与 portal-backend auth.service.ts 保持一致）：
+ * - id: 用户ID（JwtStrategy 优先从此字段提取 userId）
+ * - sub: 用户ID（标准 JWT 字段，作为 id 的备选）
+ * - aud: 受众，固定为 'internal'
+ * - nickname: 用户昵称
+ * - avatar: 用户头像 URL
+ * - phone: 手机号
+ * - orgId: 当前组织 ID（可选）
+ */
+interface JwtPayload {
+    id: string;
+    sub: string;
+    aud: string;
+    nickname: string;
+    avatar?: string;
+    phone: string;
+    orgId?: string;
+    [key: string]: any;
+}
+/**
+ * 使用 HS256 算法签名 JWT
+ */
+export declare function signJwtHS256(payload: JwtPayload, secret: string, expiresIn?: number): Promise<string>;
+/**
+ * 获取默认的 JWT Payload
+ * 格式与 portal-backend auth.service.ts 中签发的内部 JWT 保持一致
+ */
+export declare function getDefaultJwtPayload(): JwtPayload;
+export {};
+//# sourceMappingURL=jwt-utils.d.ts.map

package/dist/components/DevUserMenu/jwt-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jwt-utils.d.ts","sourceRoot":"","sources":["../../../src/components/DevUserMenu/jwt-utils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,UAAU,UAAU;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAmCD;;GAEG;AACH,wBAAsB,YAAY,CAChC,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,MAAM,EACd,SAAS,GAAE,MAAc,GACxB,OAAO,CAAC,MAAM,CAAC,CAsCjB;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,IAAI,UAAU,CAWjD"}

package/dist/components/DevUserMenu/jwt-utils.js

@@ -0,0 +1,85 @@
+/**
+ * JWT 生成工具（浏览器端实现）
+ * 使用 Web Crypto API 实现 HS256 签名
+ *
+ * JWT Payload 字段说明（与 portal-backend auth.service.ts 保持一致）：
+ * - id: 用户ID（JwtStrategy 优先从此字段提取 userId）
+ * - sub: 用户ID（标准 JWT 字段，作为 id 的备选）
+ * - aud: 受众，固定为 'internal'
+ * - nickname: 用户昵称
+ * - avatar: 用户头像 URL
+ * - phone: 手机号
+ * - orgId: 当前组织 ID（可选）
+ */
+/**
+ * Base64Url 编码（支持 Unicode 字符）
+ */
+function base64UrlEncode(str) {
+    // 使用 TextEncoder 将字符串转换为 UTF-8 字节数组
+    const encoder = new TextEncoder();
+    const bytes = encoder.encode(str);
+    // 将字节数组转换为二进制字符串
+    const binary = String.fromCharCode(...bytes);
+    // Base64 编码
+    const base64 = btoa(binary);
+    // 转换为 Base64Url 格式
+    return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
+}
+/**
+ * ArrayBuffer 转 Base64Url
+ * 注意：不能调用 base64UrlEncode，因为那个函数会用 TextEncoder 重新编码
+ */
+function arrayBufferToBase64Url(buffer) {
+    const bytes = new Uint8Array(buffer);
+    const binary = String.fromCharCode(...bytes);
+    // 直接进行 Base64 编码，不使用 TextEncoder
+    const base64 = btoa(binary);
+    // 转换为 Base64Url 格式
+    return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
+}
+/**
+ * 使用 HS256 算法签名 JWT
+ */
+export async function signJwtHS256(payload, secret, expiresIn = 86400) {
+    // 1. JWT Header
+    const header = {
+        alg: 'HS256',
+        typ: 'JWT',
+    };
+    // 2. 添加过期时间到 payload
+    const now = Math.floor(Date.now() / 1000);
+    const fullPayload = {
+        ...payload,
+        iat: now,
+        exp: now + expiresIn,
+    };
+    // 3. 编码 header 和 payload
+    const encodedHeader = base64UrlEncode(JSON.stringify(header));
+    const encodedPayload = base64UrlEncode(JSON.stringify(fullPayload));
+    const message = `${encodedHeader}.${encodedPayload}`;
+    // 4. 使用 Web Crypto API 进行 HMAC-SHA256 签名
+    const encoder = new TextEncoder();
+    const keyData = encoder.encode(secret);
+    const messageData = encoder.encode(message);
+    const cryptoKey = await crypto.subtle.importKey('raw', keyData, { name: 'HMAC', hash: 'SHA-256' }, false, ['sign']);
+    const signature = await crypto.subtle.sign('HMAC', cryptoKey, messageData);
+    // 5. 组装完整的 JWT
+    const encodedSignature = arrayBufferToBase64Url(signature);
+    return `${message}.${encodedSignature}`;
+}
+/**
+ * 获取默认的 JWT Payload
+ * 格式与 portal-backend auth.service.ts 中签发的内部 JWT 保持一致
+ */
+export function getDefaultJwtPayload() {
+    const userId = '1000000001';
+    return {
+        id: userId,
+        sub: userId,
+        aud: 'internal',
+        nickname: '开发用户',
+        avatar: '',
+        phone: '13800138000',
+        orgId: '',
+    };
+}

package/dist/components/DevUserMenu/styles.d.ts

@@ -0,0 +1,5 @@
+import type { CSSProperties } from 'react';
+export declare const devUserMenuStyles: Record<string, CSSProperties>;
+export declare const modalStyles: Record<string, CSSProperties>;
+export declare const formGroupStyles: Record<string, CSSProperties>;
+//# sourceMappingURL=styles.d.ts.map

package/dist/components/DevUserMenu/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/DevUserMenu/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CA8F3D,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAwFrD,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAwCzD,CAAC"}