@jiangood/open-admin 3.1.11 → 3.1.12

package/src/framework/fields/FieldUploadFile/index.tsx

@@ -149,7 +149,7 @@ export class FieldUploadFile extends React.Component<FieldUploadFileProps, Field
         const {accept, fileList, maxCount} = this.state;
 
         return <Upload
-            action={UrlUtils.contextPath('/admin/sysFile/upload')}
+            action={UrlUtils.contextPath('/admin/sys-file/upload')}
             data={{isPublic: this.state.isPublic}}
             listType={this.props.listType || 'picture-card'}
             fileList={fileList}

package/src/framework/fields/FieldUploadImage/index.tsx

@@ -16,6 +16,14 @@ export interface FieldUploadImageProps extends FieldProps<string> {
     isPublic?: boolean;
     /** 接受的文件类型 */
     accept?: string;
+    /** 进入裁切工具时的默认裁切比例，默认 4:3；传 null 表示自由裁切 */
+    defaultCropRatio?: Dims | null;
+    /** 缩略图与触发按钮形状，圆形用于头像类场景，默认方形 */
+    shape?: 'square' | 'circle';
+    /** 缩略图与触发按钮的尺寸（px），默认 80 */
+    size?: number;
+    /** 触发按钮的提示文案，默认不显示提示 */
+    triggerTitle?: string;
 }
 
 interface Dims {
@@ -167,6 +175,7 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
     constructor(props: FieldUploadImageProps) {
         super(props);
         ObjectUtils.copyPropertyIfPresent(props, this.state);
+        if (props.defaultCropRatio !== undefined) this.state.cropRatio = props.defaultCropRatio;
         if (props.value) this.state.objectNames = props.value.split(',');
     }
 
@@ -363,7 +372,7 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
             fd.append('file', this.state.preview.cFile);
             fd.append('thumb', tFile);
             fd.append('isPublic', String(this.state.isPublic));
-            const rs = await HttpClient.post('admin/sysFile/uploadImage', fd, null, {toastError: false});
+            const rs = await HttpClient.post('admin/sys-file/upload-image', fd, null, {toastError: false});
             this.setState(
                 (prevState) => ({objectNames: [...prevState.objectNames, rs.data.objectName]}),
                 () => this.props.onChange?.(this.state.objectNames.join(','))
@@ -395,6 +404,9 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
 
     render() {
         const {objectNames, accept, compressWidth, compressSize, cropRatio, cropperReady, fullPreviewUrl, maxCount, modalOpen, originalUrl, preview, tool, uploading} = this.state;
+        const {shape = 'square', size = 80, triggerTitle} = this.props;
+        const round = shape === 'circle';
+        const boxRadius = round ? '50%' : 4;
 
         // 画布当前显示的图片
         const canvasImg = preview
@@ -412,8 +424,8 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
                 <div>
                     {objectNames.map((name) => (
                         <div key={name} style={{
-                            position: 'relative', display: 'inline-block', marginRight: 8, verticalAlign: 'top',
-                            width: 80, height: 80, borderRadius: 4, overflow: 'hidden', cursor: 'pointer',
+                            position: 'relative', display: 'inline-block', marginRight: round ? 0 : 8, verticalAlign: 'top',
+                            width: size, height: size, borderRadius: boxRadius, overflow: 'hidden', cursor: 'pointer',
                         }}
                             onMouseEnter={(e) => {
                                 const mask = e.currentTarget.querySelector('.oa-field-upload-img-mask') as HTMLElement;
@@ -432,14 +444,14 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
                         >
                             <img
                                 src={UrlUtils.contextPath(`/file/${name}?thumb=1`)}
-                                width={80}
-                                height={80}
-                                style={{objectFit: 'cover', borderRadius: 4, display: 'block'}}
+                                width={size}
+                                height={size}
+                                style={{objectFit: 'cover', borderRadius: boxRadius, display: 'block'}}
                                 alt={name}
                             />
                             <div style={{
                                 position: 'absolute', inset: 0, display: 'flex', alignItems: 'center', justifyContent: 'center',
-                                background: 'rgba(0,0,0,0.45)', opacity: 0, transition: 'opacity .3s', borderRadius: 4,
+                                background: 'rgba(0,0,0,0.45)', opacity: 0, transition: 'opacity .3s', borderRadius: boxRadius,
                                 pointerEvents: 'none',
                             }} className="oa-field-upload-img-mask">
                                 <Space size={12}>
@@ -462,9 +474,29 @@ export class FieldUploadImage extends React.Component<FieldUploadImageProps, Fie
                         </div>
                     ))}
                     {objectNames.length < maxCount && (
-                        <Upload accept={accept} showUploadList={false} beforeUpload={this.handleBeforeUpload} multiple={false}>
-                            <Button icon={<PlusOutlined/>}>选择图片</Button>
-                        </Upload>
+                        round ? (
+                            <Upload accept={accept} showUploadList={false} beforeUpload={this.handleBeforeUpload} multiple={false}>
+                                <button type="button"
+                                        title={triggerTitle}
+                                        aria-label={triggerTitle || '选择图片'}
+                                        style={{
+                                            width: size, height: size, padding: 0, boxSizing: 'border-box',
+                                            border: '2px dashed var(--oa-color-border, #d9d9d9)',
+                                            borderRadius: '50%',
+                                            background: 'var(--oa-color-fill-quaternary, #fafafa)',
+                                            color: 'var(--oa-color-text-secondary, rgba(0, 0, 0, 0.65))',
+                                            cursor: 'pointer', lineHeight: 0,
+                                            display: 'inline-flex', alignItems: 'center', justifyContent: 'center',
+                                            fontSize: 18,
+                                        }}>
+                                    <PlusOutlined/>
+                                </button>
+                            </Upload>
+                        ) : (
+                            <Upload accept={accept} showUploadList={false} beforeUpload={this.handleBeforeUpload} multiple={false}>
+                                <Button icon={<PlusOutlined/>}>选择图片</Button>
+                            </Upload>
+                        )
                     )}
                 </div>
 

package/src/framework/fields/FieldUserPicker/index.tsx

@@ -14,9 +14,9 @@ export interface FieldUserPickerProps extends FieldProps<string[]> {
     placeholder?: string;
     /** 弹窗标题 */
     title?: string;
-    /** 分页数据源地址，默认 admin/sysUser/page */
+    /** 分页数据源地址，默认 admin/sys-user/page */
     requestUrl?: string;
-    /** 按 id 查询用户详情地址（用于回显），默认 admin/sysUser/by-ids */
+    /** 按 id 查询用户详情地址（用于回显），默认 admin/sys-user/by-ids */
     usersUrl?: string;
 }
 
@@ -52,7 +52,7 @@ export class FieldUserPicker extends React.Component<FieldUserPickerProps, Field
         }
     }
 
-    getUsersUrl = () => this.props.usersUrl || 'admin/sysUser/by-ids';
+    getUsersUrl = () => this.props.usersUrl || 'admin/sys-user/by-ids';
 
     // 根据 value(ids) 拉取并补全用户详情，按 ids 顺序展示
     syncUsers = () => {

package/src/framework/fields/orgTree.ts

@@ -1,3 +1,3 @@
 export function orgTreeUrl(type: string): string {
-    return type === 'dept' ? '/admin/sysOrg/dept-tree' : '/admin/sysOrg/unit-tree';
+    return type === 'dept' ? '/admin/sys-org/dept-tree' : '/admin/sys-org/unit-tree';
 }

package/src/framework/router/index.ts

@@ -1,4 +1,5 @@
 export {history} from './history';
 export {registerRoutes, matchRoute} from './matcher';
+export type {PageLayout, PageMeta, RouteDef, MatchResult} from './matcher';
 export {PageFrame} from './PageFrame';
 export {Link} from './Link';

package/src/framework/router/matcher.ts

@@ -4,9 +4,23 @@ function safeDecodeURIComponent(s: string): string {
     try { return decodeURIComponent(s); } catch { return s; }
 }
 
+/** 页面布局：admin = 后台菜单布局；blank = 仅渲染页面内容 */
+export type PageLayout = 'admin' | 'blank';
+
+/** 页面元信息：页面文件通过 export const pageMeta 声明，由 vite 插件写入路由表 */
+export interface PageMeta {
+    /** 页面标题：用于页签标题和浏览器标题；未设置时回退到后端菜单名 */
+    title?: string;
+    /** 是否需要登录，默认 true */
+    requiresAuth?: boolean;
+    /** 页面布局，默认 admin */
+    layout?: PageLayout;
+}
+
 export interface RouteDef {
     path: string;
     component: ComponentType<unknown>;
+    meta?: PageMeta;
 }
 
 interface InternalRoute extends RouteDef {
@@ -16,6 +30,7 @@ interface InternalRoute extends RouteDef {
 export interface MatchResult {
     component: ComponentType<unknown>;
     params: Record<string, string>;
+    meta?: PageMeta;
 }
 
 const routes: InternalRoute[] = [];
@@ -27,8 +42,8 @@ function compile(path: string): InternalRoute['segments'] {
 }
 
 export function registerRoutes(defs: RouteDef[]): void {
-    for (const {path, component} of defs) {
-        routes.push({path, component, segments: compile(path)});
+    for (const {path, component, meta} of defs) {
+        routes.push({path, component, meta, segments: compile(path)});
     }
 }
 
@@ -51,8 +66,8 @@ export function matchRoute(pathname: string): MatchResult | null {
             }
         }
         if (!ok) continue;
-        if (!dynamic) return {component: route.component, params};
-        if (!best) best = {component: route.component, params};
+        if (!dynamic) return {component: route.component, params, meta: route.meta};
+        if (!best) best = {component: route.component, params, meta: route.meta};
     }
     return best;
 }

package/src/framework/utils/AvatarUtils.ts

@@ -0,0 +1,64 @@
+import {UrlUtils} from './UrlUtils';
+
+/** 内置头像标识前缀，数据库中存 preset:avatar-1 这类值 */
+const PRESET_PREFIX = 'preset:';
+
+/** 内置头像文件命名规则，需与后端 AvatarPresets 保持一致 */
+const PRESET_PATTERN = /^preset:avatar-(?:[1-9]|1[0-2])$/;
+
+/** 十二生肖头像名称，需与后端 AvatarPresets 保持一致 */
+const ZODIAC_LABELS = ['鼠', '牛', '虎', '兔', '龙', '蛇', '马', '羊', '猴', '鸡', '狗', '猪'];
+
+export interface AvatarPreset {
+    key: string;
+    label: string;
+    url: string;
+}
+
+/**
+ * 默认头像已移除。头像为空时返回空串，由 AntD Avatar 的 icon 兜底显示人形占位。
+ *
+ * @deprecated 不再提供默认头像图片，保留该导出仅为兼容旧引用
+ */
+export const DEFAULT_AVATAR_URL = '';
+
+function presetUrl(key: string): string | null {
+    if (!PRESET_PATTERN.test(key)) {
+        return null;
+    }
+    return UrlUtils.contextPath(`/avatars/${key.substring(PRESET_PREFIX.length)}.svg`);
+}
+
+/**
+ * 接口不可用时的兜底列表，与后端 AvatarPresets 保持一致。
+ * 正常使用时优先读取 admin/public/avatar-presets 返回的数据。
+ */
+export const FALLBACK_AVATAR_PRESETS: AvatarPreset[] = [
+    ...ZODIAC_LABELS.map((label, index) => {
+        const key = `${PRESET_PREFIX}avatar-${index + 1}`;
+        return {
+            key,
+            label,
+            url: presetUrl(key) as string,
+        };
+    }),
+];
+
+export class AvatarUtils {
+
+    /** 是否为内置头像标识 */
+    static isPreset(avatar?: string | null): boolean {
+        return !!avatar && avatar.startsWith(PRESET_PREFIX);
+    }
+
+    /** 将数据库中的头像值转换为可访问的图片地址；为空或无效时返回空串，由调用方兜底占位 */
+    static resolve(avatar?: string | null): string {
+        if (!avatar) {
+            return '';
+        }
+        if (AvatarUtils.isPreset(avatar)) {
+            return presetUrl(avatar) || '';
+        }
+        return UrlUtils.contextPath(`/file/${avatar}?thumb=1`);
+    }
+}

package/src/framework/utils/HttpClient.ts

@@ -21,13 +21,13 @@ import {getMessageApi} from "./MessageApi";
  * 用法：
  * ```ts
  * // 提交：成功自动弹后端 message（如"更新成功"），失败自动弹错并 reject（可用 await 感知结果，如 FormModal 提交失败保持弹窗）
- * await HttpClient.post('admin/sysUser/create', values);
+ * await HttpClient.post('admin/sys-user/create', values);
  *
  * // 取返回数据与后端提示文案
- * const {data, message} = await HttpClient.post('admin/sysUser/create', values);
+ * const {data, message} = await HttpClient.post('admin/sys-user/create', values);
  *
  * // 成功自控提示（关闭自动弹后由业务决定）
- * await HttpClient.post('admin/sysUser/delete', {id}, null, {toastSuccess: false});
+ * await HttpClient.post('admin/sys-user/delete', {id}, null, {toastSuccess: false});
  * messageApi.success('删除成功');
  * reload();
  *
@@ -37,10 +37,10 @@ import {getMessageApi} from "./MessageApi";
  *     .catch((e) => myHandle(e));
  *
  * // $.ajax 形态
- * HttpClient.ajax({url: 'admin/sysUser/page', method: 'GET', params}).then((rs) => render(rs.data));
+ * HttpClient.ajax({url: 'admin/sys-user/page', method: 'GET', params}).then((rs) => render(rs.data));
  *
  * // 下载（返回 Promise<Blob>，成功已触发浏览器保存）
- * HttpClient.download({url: 'admin/sysUser/export', method: 'POST', data: {deptId: 1},
+ * HttpClient.download({url: 'admin/sys-user/export', method: 'POST', data: {deptId: 1},
  *     onDownloadProgress: ({loaded, total}) => console.log(loaded, total)})
  *     .catch(() => {});
  * ```

package/src/framework/utils/PageUtils.ts

@@ -2,15 +2,33 @@ import {history} from '../router';
 import {StringUtils} from "./StringUtils";
 import {UrlUtils} from "./UrlUtils";
 import {EventBus} from "./EventBus";
+import {getPageTitle} from "./TitleUtils";
+
+/** 登录页路径：公开页面，支持 ?redirect= 回跳 */
+export const LOGIN_PATH = '/login';
+
+let labelDeprecatedWarned = false;
+
+/**
+ * @internal
+ * `_label` 参数已弃用：首次被使用时提示一次，方便业务项目迁移
+ */
+export function warnDeprecatedPageLabel(): void {
+    if (labelDeprecatedWarned) return;
+    labelDeprecatedWarned = true;
+    console.warn(
+        '[open-admin] 检测到已弃用的 _label 参数：该参数已不再生效，请改用页面文件中的 pageMeta.title。'
+    );
+}
 
 export class PageUtils {
     static redirectToLogin(): void {
-        if (PageUtils.currentPathname() === '/public/login') {
+        if (PageUtils.currentPathname() === LOGIN_PATH) {
             return;
         }
         const url = PageUtils.currentUrl();
         const encodedUrl = encodeURIComponent(url);
-        history.push(`/public/login?redirect=${encodedUrl}`);
+        history.push(`${LOGIN_PATH}?redirect=${encodedUrl}`);
     }
 
     static currentParams(): Record<string, string | undefined> {
@@ -31,16 +49,29 @@ export class PageUtils {
         return StringUtils.subAfterLast(path, '/') || undefined;
     }
 
-    static open(path: string, label = '未命名'): void {
-        let targetPath = path;
+    /**
+     * 打开页面并切换到对应 Tab
+     * @param path 页面路径
+     * @param label @deprecated 已不再生效，仅用于提示迁移；页面标题请使用 pageMeta.title
+     */
+    static open(path: string, label?: string): void {
         if (label) {
-            targetPath = UrlUtils.setParam(targetPath, '_label', label);
+            warnDeprecatedPageLabel();
         }
-        history.push(targetPath);
+        history.push(path);
     }
 
+    /**
+     * @deprecated `_label` 已不再生效，页面标题请使用 pageMeta.title 或 {@link PageUtils.currentTitle}
+     */
     static currentLabel(): string | undefined {
-        return this.currentParams()['_label'];
+        warnDeprecatedPageLabel();
+        return undefined;
+    }
+
+    /** 获取当前页面标题（不含系统标题）；没有页面标题时返回 undefined */
+    static currentTitle(): string | undefined {
+        return getPageTitle();
     }
 
     static closeCurrent(): void {

package/src/framework/utils/TitleUtils.ts

@@ -0,0 +1,38 @@
+import {GlobalData} from '../GlobalData';
+
+let currentPageTitle: string | undefined;
+
+function normalize(title?: string): string | undefined {
+    return typeof title === 'string' && title.trim() ? title.trim() : undefined;
+}
+
+function systemTitle(): string {
+    const title = GlobalData.getSiteInfo()?.title;
+    return typeof title === 'string' && title.trim() ? title.trim() : 'open-admin';
+}
+
+function renderDocumentTitle(): void {
+    const next = currentPageTitle ? `${systemTitle()} | ${currentPageTitle}` : systemTitle();
+    if (document.title !== next) {
+        document.title = next;
+    }
+}
+
+/**
+ * 设置当前页面标题（不含系统标题）；传空只显示系统标题。
+ * 浏览器标题格式：`系统标题 | 页面标题`
+ */
+export function setPageTitle(title?: string): void {
+    currentPageTitle = normalize(title);
+    renderDocumentTitle();
+}
+
+/** 站点标题变化后重新渲染文档标题 */
+export function refreshDocumentTitle(): void {
+    renderDocumentTitle();
+}
+
+/** 当前页面标题（不含系统标题）；未设置时返回 undefined */
+export function getPageTitle(): string | undefined {
+    return currentPageTitle;
+}

package/src/framework/utils/UrlUtils.ts

@@ -26,16 +26,16 @@ export class UrlUtils {
 
     static paramsToSearch(params: Record<string, string | number | boolean | null | undefined> | null | undefined): string {
         if (!params) return "";
-        const buffer: string[] = [];
+        const search = new URLSearchParams();
         for (const k in params) {
             if (Object.hasOwn(params, k)) {
                 const v = params[k];
                 if (v !== null && v !== undefined) {
-                    buffer.push(`${k}=${v}`);
+                    search.append(k, String(v));
                 }
             }
         }
-        return buffer.join('&');
+        return search.toString();
     }
 
     static setParam(url: string, key: string, value: string | number | boolean | null | undefined): string {

package/src/framework/utils/index.ts

@@ -11,6 +11,8 @@ export * from './ObjectUtils'
 export * from './DictUtils'
 export * from './PermUtils'
 export * from './PageUtils'
+export * from './TitleUtils'
 export * from './HttpClient'
 export * from './MessageApi'
 export * from './ModalApi'
+export * from './AvatarUtils'

package/src/layouts/admin/HeaderRight.jsx

@@ -1,7 +1,7 @@
 import {Avatar, Dropdown, Modal} from "antd";
-import {BgColorsOutlined} from "@ant-design/icons";
+import {BgColorsOutlined, FileOutlined, MoonOutlined, ProfileOutlined, SunOutlined, UserOutlined} from "@ant-design/icons";
 import React from "react";
-import {HttpClient, PageUtils, GlobalData, getToken, history, EventBus, ThemeSettings, ARTICLE_HEADER_AVATAR_DROPDOWN, ARTICLE_HEADER_RIGHT} from "../../framework";
+import {HttpClient, PageUtils, GlobalData, history, EventBus, LOGIN_PATH, ThemeSettings, AvatarUtils, ARTICLE_HEADER_AVATAR_DROPDOWN, ARTICLE_HEADER_RIGHT, getThemeMode, toggleThemeMode, getLayoutMode, toggleLayoutMode} from "../../framework";
 
 export class HeaderRight extends React.Component {
 
@@ -13,8 +13,30 @@ export class HeaderRight extends React.Component {
         themeSettingsVisible: false,
     };
 
+    unsubscribeLoginInfo = null;
+    unsubscribeTheme = null;
+    unsubscribeLayout = null;
+
     componentDidMount() {
         this.loadArticles()
+        // 个人中心修改头像/资料后刷新顶栏显示
+        this.unsubscribeLoginInfo = EventBus.on('loginInfoChange', () => this.setState({}))
+        // 明暗切换后刷新太阳/月亮图标（其它入口切换时也能同步）
+        this.unsubscribeTheme = EventBus.on('themeChange', () => this.setState({}))
+        // 布局切换后刷新图标（其它入口切换时也能同步）
+        this.unsubscribeLayout = EventBus.on('layoutChange', () => this.setState({}))
+    }
+
+    componentWillUnmount() {
+        if (this.unsubscribeLoginInfo) {
+            this.unsubscribeLoginInfo()
+        }
+        if (this.unsubscribeTheme) {
+            this.unsubscribeTheme()
+        }
+        if (this.unsubscribeLayout) {
+            this.unsubscribeLayout()
+        }
     }
 
     loadArticles = () => {
@@ -36,11 +58,34 @@ export class HeaderRight extends React.Component {
     }
 
     account = () => {
-        PageUtils.open('/userCenter', '个人中心')
+        PageUtils.open('/user-center')
+    }
+
+    openArticle = (code) => {
+        PageUtils.open('/article/' + code)
     }
 
-    openArticle = (code, title) => {
-        PageUtils.open('/article/' + code, title)
+    renderThemeModeToggle = () => {
+        const isDark = getThemeMode() === 'dark';
+        const title = isDark ? '切换到浅色模式' : '切换到深色模式';
+        return (
+            <button type="button" className='item' title={title} aria-label={title}
+                    onClick={() => toggleThemeMode()}>
+                {isDark ? <SunOutlined/> : <MoonOutlined/>}
+            </button>
+        )
+    }
+
+    renderLayoutModeToggle = () => {
+        const isTabs = getLayoutMode() === 'tabs';
+        const title = isTabs ? '切换为单页模式' : '切换为页签模式';
+        const Icon = isTabs ? FileOutlined : ProfileOutlined;
+        return (
+            <button type="button" className='item' title={title} aria-label={title}
+                    onClick={() => toggleLayoutMode()}>
+                <Icon/>
+            </button>
+        )
     }
 
     renderThemeSettings = () => {
@@ -61,6 +106,7 @@ export class HeaderRight extends React.Component {
 
     render() {
         const info = GlobalData.getLoginInfo()
+        const avatarSrc = AvatarUtils.resolve(info.avatar)
         const {dropdownArticles, headerArticles} = this.state
 
         const articleItems = dropdownArticles.map(a => ({
@@ -69,7 +115,7 @@ export class HeaderRight extends React.Component {
         }))
 
         const menuItems = [
-            {key: 'userCenter', label: '个人中心'},
+            {key: 'user-center', label: '个人中心'},
             ...articleItems,
             {key: 'logout', label: '退出登录'},
         ]
@@ -77,31 +123,31 @@ export class HeaderRight extends React.Component {
         return <div className='header-right'>
             {headerArticles.map(a => (
                 <button key={a.code} type="button" className='item'
-                        onClick={() => this.openArticle(a.code, a.title)}>
+                        onClick={() => this.openArticle(a.code)}>
                     {a.title}
                 </button>
             ))}
 
+            {this.renderLayoutModeToggle()}
+
+            {this.renderThemeModeToggle()}
+
             {this.renderThemeSettings()}
 
             <Dropdown menu={{
                 onClick: ({key}) => {
-                    if (key === 'userCenter') {
+                    if (key === 'user-center') {
                         this.account()
                     } else if (key === 'logout') {
                         this.logout();
                     } else if (key.startsWith('article:')) {
-                        const code = key.substring(8)
-                        const article = dropdownArticles.find(a => a.code === code)
-                        this.openArticle(code, article ? article.title : code)
+                        this.openArticle(key.substring(8))
                     }
                 },
                 items: menuItems,
             }}>
                 <div className='item' style={{cursor: 'pointer'}}>
-                    <Avatar size="default" style={{backgroundColor: getToken().colorPrimary}}>
-                        {info.name?.charAt(0)}
-                    </Avatar>
+                    <Avatar size="default" src={avatarSrc || undefined} icon={<UserOutlined/>}/>
                     <span style={{marginLeft: 8}}>{info.name}</span>
                 </div>
             </Dropdown>
@@ -111,7 +157,7 @@ export class HeaderRight extends React.Component {
                    onOk={() => {
                        this.setState({alertVisible: false});
                         EventBus.emit('logoutSuccess');
-                        history.replace('/public/login')
+                        history.replace(LOGIN_PATH)
                     }}>
                  退出登录成功
             </Modal>
@@ -121,7 +167,7 @@ export class HeaderRight extends React.Component {
                        this.setState({confirmVisible: false});
                        localStorage.clear();
                        EventBus.emit('logoutSuccess');
-                       history.replace('/public/login')
+                       history.replace(LOGIN_PATH)
                    }}>
                 退出登录失败，是否清空缓存
             </Modal>

package/src/layouts/admin/SinglePageLayout.jsx

@@ -1,8 +1,8 @@
 import React from "react";
-import {history, PageFrame} from "../../framework";
+import {history, PageFrame, matchRoute, setPageTitle} from "../../framework";
 
 /**
- * 单页布局：不使用标签页，仅渲染当前路由对应页面。
+ * 单页布局：不使用页签，仅渲染当前路由对应页面。
  * 路由变化时按 url 重新挂载 PageFrame，页面状态随之重置。
  */
 export class SinglePageLayout extends React.Component {
@@ -14,6 +14,11 @@ export class SinglePageLayout extends React.Component {
         this.unlisten = history.listen(({location}) => {
             this.setState({location});
         });
+        this.syncDocumentTitle();
+    }
+
+    componentDidUpdate() {
+        this.syncDocumentTitle();
     }
 
     componentWillUnmount() {
@@ -22,6 +27,12 @@ export class SinglePageLayout extends React.Component {
         }
     }
 
+    syncDocumentTitle() {
+        const {pathname} = this.state.location;
+        const label = matchRoute(pathname)?.meta?.title || this.props.pathMenuMap?.[pathname]?.name;
+        setPageTitle(label);
+    }
+
     render() {
         const {pathname, search} = this.state.location;
         const url = pathname + search;