@jiangood/open-admin 3.0.14 → 3.1.0

package/src/framework/utils/StringUtils.ts

@@ -3,14 +3,14 @@ export class StringUtils {
     static readonly ISO_SPLITTER: string = "/";
 
     static removePrefix(str: string | null | undefined, ch: string): string {
-        if (str != null && str.startsWith(ch)) {
+        if (str?.startsWith(ch)) {
             return str.substring(ch.length);
         }
         return str ?? '';
     }
 
     static removeSuffix(str: string | null | undefined, ch: string): string {
-        if (str != null && str.endsWith(ch)) {
+        if (str?.endsWith(ch)) {
             return str.substring(0, str.length - ch.length);
         }
         return str ?? '';
@@ -18,9 +18,11 @@ export class StringUtils {
 
     static random(length: number): string {
         const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+        const values = new Uint32Array(length);
+        crypto.getRandomValues(values);
         let result = '';
         for (let i = 0; i < length; i++) {
-            result += characters.charAt(Math.floor(Math.random() * characters.length));
+            result += characters.charAt(values[i] % characters.length);
         }
         return result;
     }
@@ -61,7 +63,7 @@ export class StringUtils {
     static getWidth(str: string | null | undefined): number {
         if (str == null || str.length === 0) return 0;
         return str.split('').reduce((pre, cur) => {
-            const charCode = cur.charCodeAt(0);
+            const charCode = cur.codePointAt(0);
             return pre + (charCode >= 0 && charCode <= 128 ? 1 : 2);
         }, 0);
     }
@@ -69,7 +71,7 @@ export class StringUtils {
     static cutByWidth(str: string, maxWidth: number): string {
         let showLength = 0;
         return str.split('').reduce((pre, cur) => {
-            const charCode = cur.charCodeAt(0);
+            const charCode = cur.codePointAt(0);
             const charWidth = (charCode >= 0 && charCode <= 128) ? 1 : 2;
             if (showLength + charWidth <= maxWidth) {
                 showLength += charWidth;
@@ -88,17 +90,17 @@ export class StringUtils {
         return StringUtils.cutByWidth(str, len) + suffix;
     }
 
-    static isString(value: any): value is string {
+    static isString(value: unknown): value is string {
         return typeof value === 'string';
     }
 
-    static split(str: any, sp: string): string[] {
+    static split(str: string | string[] | null | undefined, sp: string): string[] {
         if (str == null || str.length === 0) return [];
         if (Array.isArray(str)) return str;
         return str.split(sp);
     }
 
-    static join(arr: any, sp: string): string {
+    static join(arr: unknown, sp: string): string {
         if (arr == null || !Array.isArray(arr)) {
             return '';
         }

package/src/framework/utils/TreeUtils.ts

@@ -1,8 +1,8 @@
-export interface TreeNode<T = any> {
+export interface TreeNode<T = unknown> {
     id: string | number;
     pid: string | number | null;
     children?: TreeNode<T>[];
-    [key: string]: any;
+    [key: string]: unknown;
 }
 
 export class TreeUtils {
@@ -19,7 +19,7 @@ export class TreeUtils {
     static findByKey<T extends TreeNode>(key: string | number, list: T[], keyName: keyof T | 'id' = 'id'): T | undefined {
         for (const item of list) {
             if (item[keyName as keyof T] === key) return item;
-            if (item.children && item.children.length) {
+            if (item.children?.length) {
                 const rs = TreeUtils.findByKey(key, item.children as T[], keyName);
                 if (rs) return rs;
             }

package/src/framework/utils/UrlUtils.ts

@@ -28,7 +28,7 @@ export class UrlUtils {
         if (!params) return "";
         const buffer: string[] = [];
         for (const k in params) {
-            if (Object.prototype.hasOwnProperty.call(params, k)) {
+            if (Object.hasOwn(params, k)) {
                 const v = params[k];
                 if (v !== null && v !== undefined) {
                     buffer.push(`${k}=${v}`);
@@ -66,6 +66,7 @@ export class UrlUtils {
      */
     static contextPath(path: string): string {
         const base = import.meta.env.VITE_SERVER_SERVLET_CONTEXT_PATH;
-        return base + path;
+        if (base === '/' || base === '') return path;
+        return base.replace(/\/+$/, '') + path; // NOSONAR: 需去除尾部斜杠，正则已最简
     }
 }

package/src/framework/utils/index.ts

@@ -7,6 +7,9 @@ export * from "./TreeUtils";
 export * from './StorageUtils'
 export * from './DeviceUtils'
 export * from './ObjectUtils'
-export * from './system'
+export * from './DictUtils'
+export * from './PermUtils'
+export * from './PageUtils'
+export * from './HttpClient'
 export * from './MessageApi'
 export * from './ModalApi'

package/src/framework/views/ViewApproveStatus/index.tsx

@@ -1,9 +1,8 @@
 import {DictUtils} from "../../utils";
-import {Tag} from "antd";
 import {Component} from "react";
 import type {ViewProps} from "../types";
 
-export class ViewApproveStatus extends Component<ViewProps<String>> {
+export class ViewApproveStatus extends Component<ViewProps<string>> {
     render() {
         const {value} = this.props;
         return DictUtils.dictTag('approveStatus', value);

package/src/framework/views/ViewBoolean/index.tsx

@@ -4,6 +4,9 @@ import type {ViewProps} from "../types";
 export class ViewBoolean extends React.Component<ViewProps<boolean>> {
     render() {
         const {value} = this.props;
-        return value == null ? null : (value ? '是' : '否');
+        if (value == null) {
+            return null;
+        }
+        return value ? '是' : '否';
     }
 }

package/src/framework/views/ViewFile/index.tsx

@@ -23,8 +23,8 @@ export class ViewFile extends React.Component {
             return    <iframe
                 src={url}
                 width='99%'
-                frameBorder={0}
-                style={{height}}
+                title="文件预览"
+                style={{height, border: 0}}
             />
         }
 
@@ -34,8 +34,8 @@ export class ViewFile extends React.Component {
                 <iframe
                     src={url}
                     width='99%'
-                    frameBorder={0}
-                    style={{height}}
+                    title="文件预览"
+                    style={{height, border: 0}}
                 />
             </div>
         });

package/src/framework/views/ViewImage/index.tsx

@@ -16,7 +16,7 @@ import {UrlUtils} from '../../utils';
  */
 export class ViewImage extends React.Component {
 
-  static previewGroupProps = {
+  static readonly previewGroupProps = {
     preview: {
       scaleStep: 0.3,
     },
@@ -61,7 +61,7 @@ export class ViewImage extends React.Component {
 
     return (
       <Image.PreviewGroup preview={previewConfig}>
-        {items.map((item, i) => (
+        {items.map((item) => (
           <Image
             key={item.url}
             src={item.thumb}

package/src/framework/views/ViewPassword/index.tsx

@@ -16,9 +16,10 @@ export class ViewPassword extends React.Component {
         const visible = this.state.visible;
         return <Space>
             <span>{this.state.visible ? v : '******'}</span>
-            <a onClick={() => this.setState({visible: !visible})}>
+            <button type="button" style={{background: 'none', border: 'none', padding: 0, font: 'inherit', cursor: 'pointer'}}
+                    onClick={() => this.setState({visible: !visible})}>
                 {visible ? <EyeOutlined/> : <EyeInvisibleOutlined/>}
-            </a>
+            </button>
         </Space>
     }
 }

package/src/framework/views/ViewText/index.tsx

@@ -8,7 +8,7 @@ export class ViewText extends React.Component {
         modalOpen: false,
     };
 
-    static defaultProps = {
+    static readonly defaultProps = {
         ellipsis: false,
         maxLength: 15
     }
@@ -27,9 +27,18 @@ export class ViewText extends React.Component {
         const short = StringUtils.ellipsis(value, maxLength);
         return (
             <Tooltip placement="topLeft" title={value}>
-                <span style={{cursor: 'pointer', borderBottom: '1px dashed #d9d9d9'}} onClick={() => this.setState({modalOpen: true})}>
+                <button type="button"
+                        style={{
+                            background: 'none',
+                            border: 'none',
+                            borderBottom: '1px dashed #d9d9d9',
+                            padding: 0,
+                            font: 'inherit',
+                            cursor: 'pointer',
+                        }}
+                        onClick={() => this.setState({modalOpen: true})}>
                     {short}
-                </span>
+                </button>
                 <Modal open={this.state.modalOpen} title="长文本内容" width={700} footer={null}
                        onCancel={() => this.setState({modalOpen: false})}>
                     <div style={{height: 500, overflowY: 'auto'}}>{value}</div>

package/src/framework/views/types.ts

@@ -15,12 +15,10 @@ export interface ViewProps<T> {
  * 通用视图组件类类型
  * @template T - value 的类型
  */
-export interface ViewComponent<T> extends React.ComponentClass<ViewProps<T> & any> {
-}
+export type ViewComponent<T> = React.ComponentClass<ViewProps<T>>;
 
 /**
  * 通用视图组件函数类型
  * @template T - value 的类型
  */
-export interface ViewFunctionComponent<T> extends React.FC<ViewProps<T> & any> {
-}
+export type ViewFunctionComponent<T> = React.FC<ViewProps<T>>;

package/src/layouts/admin/AdminTabs.jsx

@@ -43,7 +43,16 @@ export class AdminTabs extends React.Component {
                         <div
                             key={tab.key}
                             className={`admin-tab${tab.key === activeKey ? ' active' : ''}`}
+                            role="tab"
+                            tabIndex={tab.key === activeKey ? 0 : -1}
+                            aria-selected={tab.key === activeKey}
                             onClick={() => onChange(tab.key)}
+                            onKeyDown={e => {
+                                if (e.key === 'Enter' || e.key === ' ') {
+                                    e.preventDefault();
+                                    onChange(tab.key);
+                                }
+                            }}
                             onContextMenu={e => this.handleContextMenu(e, tab.key)}
                         >
                             <span className="admin-tab-label">{tab.label}</span>

package/src/layouts/admin/AdminTabs.less

@@ -52,11 +52,11 @@
             height: 16px;
             font-size: 12px;
             border-radius: 50%;
-            color: rgba(0, 0, 0, 0.45);
+            color: rgba(0, 0, 0, 0.45); /* NOSONAR: 次要文本颜色，设计如此 */
 
             &:hover {
                 background: rgba(0, 0, 0, 0.08);
-                color: rgba(0, 0, 0, 0.88);
+                color: rgba(0, 0, 0, 0.88); /* NOSONAR: 悬停态主文本色，对比度设计如此 */
             }
         }
     }

package/src/layouts/admin/HeaderRight.jsx

@@ -1,6 +1,6 @@
 import {Avatar, Dropdown, Modal} from "antd";
 import React from "react";
-import {DeviceUtils, HttpUtils, PageUtils, GlobalData, getToken, history, EventBus, ARTICLE_HEADER_AVATAR_DROPDOWN, ARTICLE_HEADER_RIGHT} from "../../framework";
+import {DeviceUtils, HttpClient, PageUtils, GlobalData, getToken, history, EventBus, ARTICLE_HEADER_AVATAR_DROPDOWN, ARTICLE_HEADER_RIGHT} from "../../framework";
 
 export class HeaderRight extends React.Component {
 
@@ -28,10 +28,10 @@ export class HeaderRight extends React.Component {
     }
 
     logout = () => {
-        HttpUtils.post('admin/auth/logout').then(async () => {
+        HttpClient.post('admin/auth/logout', null, null, {toastError: false}).then(() => {
             localStorage.clear()
             this.setState({alertVisible: true})
-        }).catch(async e => {
+        }).catch(e => {
             console.error('[HeaderRight] 退出登录失败:', e);
             this.setState({confirmVisible: true})
         })
@@ -51,7 +51,8 @@ export class HeaderRight extends React.Component {
 
         if (this.state.isMobileDevice) {
             return <div className='header-right'>
-                <a onClick={this.logout}>退出</a>
+                <button type="button" style={{background: 'none', border: 'none', padding: 0, font: 'inherit', cursor: 'pointer'}}
+                        onClick={this.logout}>退出</button>
             </div>
         }
 
@@ -68,10 +69,10 @@ export class HeaderRight extends React.Component {
 
         return <div className='header-right'>
             {headerArticles.map(a => (
-                <div key={a.code} className='item' style={{cursor: 'pointer'}}
-                     onClick={() => this.openArticle(a.code, a.title)}>
+                <button key={a.code} type="button" className='item'
+                        onClick={() => this.openArticle(a.code, a.title)}>
                     {a.title}
-                </div>
+                </button>
             ))}
 
             <Dropdown menu={{

package/src/layouts/admin/TabLayout.jsx

@@ -34,7 +34,7 @@ export class TabLayout extends React.Component {
         const pathname = qIndex === -1 ? url : url.substring(0, qIndex);
         const search = qIndex === -1 ? '' : url.substring(qIndex);
         this.setState(prev => ({
-            tabs: prev.tabs.find(t => t.key === url) ? prev.tabs
+            tabs: prev.tabs.some(t => t.key === url) ? prev.tabs
                 : [...prev.tabs, {key: url, label: getLabel(pathname, search, this.props.pathMenuMap), refreshKey: 0}],
             activeKey: url,
         }));
@@ -42,7 +42,7 @@ export class TabLayout extends React.Component {
 
     closeTab = (key) => {
         this.setState(prev => {
-            if (!prev.tabs.find(t => t.key === key)) return null;
+            if (!prev.tabs.some(t => t.key === key)) return null;
             const next = prev.tabs.filter(t => t.key !== key);
             if (next.length === 0) {
                 setTimeout(() => history.push('/'), 0);

package/src/layouts/admin/index.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import {Layout, Menu, Skeleton, Watermark} from 'antd';
 
 import "./index.less"
-import {HttpUtils, NamedIcon, PageUtils, GlobalData, TreeUtils, history, Link, ARTICLE_HEADER_LEFT, OrgSwitcher} from "../../framework";
+import {HttpClient, NamedIcon, PageUtils, GlobalData, TreeUtils, history, Link, ARTICLE_HEADER_LEFT, OrgSwitcher} from "../../framework";
 
 import { HeaderRight } from "./HeaderRight";
 import { TabLayout } from "./TabLayout";
@@ -10,7 +10,7 @@ const {Header, Sider, Content} = Layout;
 /**
  * 带菜单的布局，主要处理布局宇框架结构
  */
-export default class extends React.Component {
+export default class AdminLayout extends React.Component {
 
     state = {
         loginInfo: {},
@@ -50,8 +50,8 @@ export default class extends React.Component {
 
     initMenu = () => {
         this.setState({menuLoading: true})
-        HttpUtils.get('/admin/menu-info').then(info => {
-            const {menuTree, pathMenuMap, menuMap} = info
+        HttpClient.get('/admin/menu-info', null, {toastError: false}).then(info => {
+            const {menuTree, pathMenuMap, menuMap} = info.data
             this.setState({menuMap})
 
             const pathname = PageUtils.currentPathname();
@@ -86,15 +86,15 @@ export default class extends React.Component {
             }
 
             this.setState({menuTree, pathMenuMap, topMenus, sideMenus, activeTopMenuKey, currentMenuKey})
+            this.setState({menuLoading: false})
 
         }).catch(err => {
             console.error('加载菜单失败:', err)
             this.setState({menuTree: [], topMenus: [], sideMenus: []})
-        }).finally(()=>{
             this.setState({menuLoading: false})
         })
     }
-    actionRef = React.createRef()
+    actionRef = React.createRef() // NOSONAR: React ref 由父组件通过 ref 访问
 
     classifyMenus = (menuTree) => {
         const topMenus = [];
@@ -166,13 +166,14 @@ export default class extends React.Component {
         return (
             <nav className="top-nav">
                 {topMenus.map(item => (
-                    <span
+                    <button
                         key={item.key}
+                        type="button"
                         className={'top-nav-item' + (item.key === activeTopMenuKey ? ' active' : '')}
                         onClick={() => this.onTopMenuClick({key: item.key})}
                     >
                         {item.label}
-                    </span>
+                    </button>
                 ))}
             </nav>
         );
@@ -188,7 +189,10 @@ return <Layout className='main-layout'>
                    breakpoint={'md'}
              >
                 <div className='sider-header'>
-                    <img className='logo-img' src="./logo.png" onClick={() => history.push('/')} alt='logo'/>
+                    <button type="button" className='logo-img'
+                            onClick={() => history.push('/')}>
+                        <img src="./logo.png" alt='logo'/>
+                    </button>
                     <h3 className='hide-on-mobile'>
                         <Link to="/" style={{color: 'rgba(255,255,255,0.85)'}}>{siteInfo.title}</Link>
                     </h3>
@@ -201,8 +205,8 @@ return <Layout className='main-layout'>
                 <Header className='header'>
                     {this.renderTopMenu()}
                     {this.state.headerLeftArticles.map(a => (
-                        <div key={a.code} className='item' style={{cursor: 'pointer', padding: '0 12px', whiteSpace: 'nowrap'}}
-                             onClick={() => PageUtils.open('/article/' + a.code, a.title)}>{a.title}</div>
+                        <button key={a.code} type="button" className='item'
+                                onClick={() => PageUtils.open('/article/' + a.code, a.title)}>{a.title}</button>
                     ))}
                     {this.props.showOrgSwitcher?.({
                         activeTopMenu: this.getActiveTopMenu(),

package/src/layouts/admin/index.less

@@ -27,6 +27,9 @@
         color: rgba(0, 0, 0, 0.65);
         transition: color 0.2s;
         white-space: nowrap;
+        background: none;
+        border: none;
+        font: inherit;
 
         &:hover {
           color: var(--primary-color, var(--primary-color, #1961AC));
@@ -50,10 +53,13 @@
         align-items: center;
         padding: 0 0.5rem;
         cursor: pointer;
+        background: none;
+        border: none;
+        font: inherit;
 
         &:hover {
           background: var(--primary-color-hover, #4990CD);
-          color: white;
+          color: white; /* NOSONAR: 主题色悬停态，对比度由主题色决定 */
         }
       }
     }
@@ -74,6 +80,15 @@
       .logo-img {
         height: 36px;
         cursor: pointer;
+        background: none;
+        border: none;
+        padding: 0;
+        display: inline-flex;
+        align-items: center;
+
+        img {
+          height: 36px;
+        }
       }
 
       h3 {

package/src/layouts/index.tsx

@@ -3,12 +3,10 @@ import {ConfigProvider, Modal} from "antd";
 import zhCN from 'antd/locale/zh_CN';
 import dayjs from 'dayjs';
 import 'dayjs/locale/zh-cn';
-import {history, PageFrame} from "../framework";
+import {ErrorBoundary, GlobalData, HttpClient, PageFrame, PageLoading, PageUtils, history, getThemeConfig, setThemeColors, EventBus} from "../framework";
+import type {ThemeColors} from "../framework";
 
 import AdminLayout from "./admin"
-import {HttpUtils, PageLoading, PageUtils, GlobalData, getThemeConfig, setThemeColors, EventBus} from "../framework";
-import {ErrorBoundary} from "../framework";
-import type {ThemeColors} from "../framework";
 
 import '../style/global.less'
 import './index.less'
@@ -76,8 +74,8 @@ export class Layouts extends React.Component<LayoutsProps> {
     }
 
     loadSiteInfo() {
-        HttpUtils.get("/admin/public/site-info").then(data => {
-            GlobalData.setSiteInfo(data);
+        HttpClient.get("/admin/public/site-info", null, {toastError: false}).then(data => {
+            GlobalData.setSiteInfo(data.data);
             this.setState({siteInfoLoaded: true});
         }).catch(() => {
             console.error('[Layout] 加载站点信息失败');
@@ -85,12 +83,12 @@ export class Layouts extends React.Component<LayoutsProps> {
     }
 
     loadLoginInfo() {
-        HttpUtils.get('/admin/public/login-info').then(data => {
-            GlobalData.setDictInfo(data.dictInfo);
-            GlobalData.setLoginInfo(data.loginInfo);
-            GlobalData.setSiteArticles(data.siteArticles);
+        HttpClient.get('/admin/public/login-info', null, {toastError: false}).then(data => {
+            GlobalData.setDictInfo(data.data.dictInfo);
+            GlobalData.setLoginInfo(data.data.loginInfo);
+            GlobalData.setSiteArticles(data.data.siteArticles);
 
-            if (data.needUpdatePwd) {
+            if (data.data.needUpdatePwd) {
                 this.setState({loginChecked: true});
                 history.push('/standalone/forceUpdatePwd');
                 return;
@@ -116,7 +114,7 @@ export class Layouts extends React.Component<LayoutsProps> {
         this.loadData();
     }
 
-    componentDidUpdate(prevProps: {}, prevState: typeof this.state) {
+    componentDidUpdate(prevProps: LayoutsProps, prevState: typeof this.state) {
         if (this.state.location !== prevState.location) {
             this.loadData();
         }
@@ -144,18 +142,26 @@ export class Layouts extends React.Component<LayoutsProps> {
         return (
             <ErrorBoundary minimal>
                 <ConfigProvider {...baseConfigProps} theme={getThemeConfig()}>
-                    {showPageFrame ? <PageFrame url={pathname + search}/> : ready ? <AdminLayout headerExtra={this.props.headerExtra} showOrgSwitcher={this.props.showOrgSwitcher} loginInfo={GlobalData.getLoginInfo()}/> : (
-                        <PageLoading messages={[
-                            !siteInfoLoaded && '加载站点信息...',
-                            !loginChecked && '检查登录中...',
-                        ].filter(Boolean)}/>
-                    )}
+                    {this.renderContent(showPageFrame, ready, pathname, search)}
                     {this.renderLoginExpiredModal()}
                 </ConfigProvider>
             </ErrorBoundary>
         );
     }
 
+    renderContent(showPageFrame: boolean, ready: boolean, pathname: string, search: string) {
+        if (showPageFrame) {
+            return <PageFrame url={pathname + search}/>;
+        }
+        if (ready) {
+            return <AdminLayout headerExtra={this.props.headerExtra} showOrgSwitcher={this.props.showOrgSwitcher} loginInfo={GlobalData.getLoginInfo()}/>;
+        }
+        return <PageLoading messages={[
+            !this.state.siteInfoLoaded && '加载站点信息...',
+            !this.state.loginChecked && '检查登录中...',
+        ].filter(Boolean)}/>;
+    }
+
     renderLoginExpiredModal() {
         return (
             <Modal open={this.state.loginExpiredVisible} title="确认操作" okText="确定"

package/src/pages/404.jsx

@@ -2,7 +2,7 @@ import React from "react";
 import {Result} from "antd";
 import {Page} from "../framework";
 
-export default class extends React.Component {
+export default class NotFound extends React.Component {
 
     render() {
         return <Page>

package/src/pages/article/$code.jsx

@@ -1,8 +1,8 @@
 import React from "react";
-import {HttpUtils, Page, UrlUtils} from "../../framework";
+import {HttpClient, Page, UrlUtils} from "../../framework";
 import "./article.less";
 
-export default class extends React.Component {
+export default class ArticlePage extends React.Component {
 
     state = {
         article: null,
@@ -12,8 +12,8 @@ export default class extends React.Component {
     componentDidMount() {
         const code = this.props.params?.code
         if (code) {
-            HttpUtils.get('admin/article/getByCode', {code}).then(rs => {
-                this.setState({article: rs, loading: false})
+            HttpClient.get('admin/article/getByCode', {code}, {toastError: false}).then(rs => {
+                this.setState({article: rs.data, loading: false})
             }).catch(() => {
                 this.setState({loading: false})
             })

package/src/pages/index.jsx

@@ -2,7 +2,7 @@ import React from "react";
 import {Card} from "antd";
 import {Page} from "../framework";
 
-export default class extends React.Component {
+export default class HomePage extends React.Component {
     render() {
         return <Page title="首页" description="欢迎使用本系统">
             <Card>欢迎使用本系统</Card>