Преглед изворни кода

bugID=93
6.将用户名、退出功能移至底部通栏的左下角区域,并弱化红色色块。
7.将冠医云的名称去掉,改为百之逸logo(素材参见附件)。

dengdx пре 1 недеља
родитељ
комит
614d4dfca5
4 измењених фајлова са 157 додато и 111 уклоњено
  1. BIN
      src/assets/imgs/bzylogo.png
  2. 21 13
      src/layouts/BasicLayout.tsx
  3. 134 0
      src/layouts/BottomBar.tsx
  4. 2 98
      src/layouts/SystemZone.tsx

BIN
src/assets/imgs/bzylogo.png


+ 21 - 13
src/layouts/BasicLayout.tsx

@@ -4,9 +4,10 @@ import { useSelector, useDispatch } from 'react-redux';
 import { Layout, Row, Col, ConfigProvider, Image } from 'antd';
 import { TabBar } from 'antd-mobile';
 
-import logo from '../assets/imgs/logo-v3.jpg';
+import logo from '@/assets/imgs/logo-v3.jpg';
 import NavbarFloat from './NavbarFloat';
 import NavMenu from './NavMenu';
+import BottomBar from './BottomBar';
 import StatusBar, { StatusBarProps } from './StateBar';
 import RegisterPage from '@/pages/patient/register';
 import WorklistPage from '@/pages/patient/worklist';
@@ -77,18 +78,18 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
     if (key === 'print') {
       // 获取当前选中的记录
       const state = store.getState();
-      const selectedIds = 
-        currentKey === 'historylist' 
-          ? state.historySelection.selectedIds 
+      const selectedIds =
+        currentKey === 'historylist'
+          ? state.historySelection.selectedIds
           : currentKey === 'worklist'
-          ? state.workSelection.selectedIds
-          : [];
-      
+            ? state.workSelection.selectedIds
+            : [];
+
       if (selectedIds.length === 0) {
         message.warning('请先选择要打印的项目');
         return;
       }
-      
+
       try {
         // 调用 historyToPrint 加载数据并跳转
         await historyToPrint(selectedIds);
@@ -202,13 +203,17 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
             style={{ borderBottom: '1px solid #e5e7eb' }}
           >
             {/* 品牌区域 */}
-            <Col xl={4} lg={4} md={5} sm={0} xs={0} className="h-full">
-              <Image src={logo} alt="Logo" height={'100%'} />
+            <Col xl={8} lg={8} md={5} sm={0} xs={0} className="h-full">
+              {/* <Image src={logo} alt="Logo" height={'100%'} /> */}
+              {/* 底部通栏:仅在桌面端显示 */}
+              <div className="xl:block lg:block md:hidden sm:hidden xs:hidden">
+                <BottomBar />
+              </div>
             </Col>
             {/* 状态区域 */}
             <Col
-              xl={20}
-              lg={20}
+              xl={16}
+              lg={16}
               md={19}
               sm={0}
               xs={0}
@@ -231,6 +236,9 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
             </Col>
           </Row>
         )}
+
+
+
         {/* Tabbar:固定在底部,仅在手机屏幕显示 */}
         <div className="sticky bottom-0 w-full bg-red xl:hidden">
           <TabBar
@@ -275,7 +283,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
                   isLogin={true} // TODO: 替换为实际登录状态
                   avatarUrl={undefined} // TODO: 替换为实际头像
                   onClick={() => handleMenuClick('profile')}
-                  // 不传递username
+                // 不传递username
                 />
               }
             />

+ 134 - 0
src/layouts/BottomBar.tsx

@@ -0,0 +1,134 @@
+import React, { useState } from 'react';
+import { Row, Col, Image } from 'antd';
+import { useSelector } from 'react-redux';
+import { RootState } from '@/states/store';
+import { isLoggedIn } from '../states/user_info';
+import Icon from '@/components/Icon';
+import { IconButton } from '@/components/IconButton';
+import ExitModal from '@/components/ExitModal';
+import { showNotImplemented } from '@/utils/notificationHelper';
+import { FormattedMessage } from 'react-intl';
+import logo from '@/assets/imgs/bzylogo.png';
+
+const BottomBar: React.FC = () => {
+    const login = useSelector((state: RootState) => isLoggedIn(state.userInfo));
+    const username = useSelector((state: RootState) => state.userInfo.name);
+    const avatarUrl = useSelector((state: RootState) => state.userInfo.avatar);
+
+    // 退出弹框状态管理
+    const [exitModalVisible, setExitModalVisible] = useState(false);
+
+    const handleExitClick = (): void => {
+        setExitModalVisible(true);
+    };
+
+    const handleExitModalClose = (): void => {
+        setExitModalVisible(false);
+    };
+
+    return (
+        <>
+            <Row
+                gutter={12}
+                style={{
+                    position: 'sticky',
+                    bottom: 0,
+                    left: 0,
+                    width: '100%',
+                    padding: '8px 16px',
+                    boxShadow: '0 -2px 5px rgba(0,0,0,0.1)',
+                    alignItems: 'center',
+                }}
+            >
+                {/* Logo */}
+                <Col flex="none">
+                    <Image
+                        src={logo}
+                        alt="Logo"
+                        height={'40px'}
+                        preview={false}
+                        style={{ display: 'block' }}
+                    />
+                </Col>
+
+                {/* 用户按钮 */}
+                <Col flex="none">
+                    <IconButton
+                        icon={
+                            login ? (
+                                avatarUrl ? (
+                                    <Icon
+                                        module="module-common"
+                                        name="btn_3DCam_AIView"
+                                        userId="user-A"
+                                        theme="default"
+                                        size="2x"
+                                        state="normal"
+                                        url={avatarUrl}
+                                    />
+                                ) : (
+                                    <Icon
+                                        module="module-security"
+                                        name="user-not-login"
+                                        userId="user-A"
+                                        theme="default"
+                                        size="2x"
+                                        state="normal"
+                                    />
+                                )
+                            ) : (
+                                <Icon
+                                    module="module-common"
+                                    name="user-not-login"
+                                    userId="user-A"
+                                    theme="default"
+                                    size="2x"
+                                    state="normal"
+                                />
+                            )
+                        }
+                        iconPlace="left"
+                        iconSize={32}
+                        type="default"
+                        style={{ padding: '4px 12px' }}
+                        onClick={() => showNotImplemented('我的')}
+                    >
+                        {login ? username : '未登录'}
+                    </IconButton>
+                </Col>
+
+                {/* 退出按钮 */}
+                <Col flex="none">
+                    <IconButton
+                        data-testid="exit-button"
+                        icon={
+                            <Icon
+                                module="module-common"
+                                name="btn_3DCam_AIView"
+                                userId="user-A"
+                                theme="default"
+                                size="2x"
+                                state="normal"
+                            />
+                        }
+                        iconPlace="left"
+                        iconSize={32}
+                        type="default"
+                        style={{ padding: '4px 12px' }}
+                        onClick={handleExitClick}
+                    >
+                        <FormattedMessage
+                            id="nav.logout"
+                            defaultMessage="退出"
+                        />
+                    </IconButton>
+                </Col>
+            </Row>
+
+            {/* 退出选择弹框 */}
+            <ExitModal visible={exitModalVisible} onClose={handleExitModalClose} />
+        </>
+    );
+};
+
+export default BottomBar;

+ 2 - 98
src/layouts/SystemZone.tsx

@@ -1,16 +1,9 @@
 import React, { forwardRef, useState } from 'react';
 import { Space, Row } from 'antd';
-import MeButton from '../pages/security/components/MeButton';
-import { useSelector } from 'react-redux';
-import { RootState } from '@/states/store';
-import { isLoggedIn } from '../states/user_info';
-import Icon from '@/components/Icon';
 import { IconButton } from '@/components/IconButton';
-import ExitModal from '@/components/ExitModal';
+import Icon from '@/components/Icon';
 import SettingsModal from '@/pages/system/SettingsModal/SettingsModal';
-import { showNotImplemented } from '@/utils/notificationHelper';
 import { FormattedMessage } from 'react-intl';
-import { UserOutlined } from '@ant-design/icons';
 
 interface SystemZoneProps {
   onMenuClick?: (key: string) => void;
@@ -19,23 +12,9 @@ interface SystemZoneProps {
 const SystemZone = forwardRef<HTMLDivElement, SystemZoneProps>(
   // eslint-disable-next-line
   ({ onMenuClick }, ref) => {
-    const login = useSelector((state: RootState) => isLoggedIn(state.userInfo));
-    const username = useSelector((state: RootState) => state.userInfo.name);
-    const avatarUrl = useSelector((state: RootState) => state.userInfo.avatar);
-
-    // 退出弹框状态管理
-    const [exitModalVisible, setExitModalVisible] = useState(false);
     // 系统设置弹框状态管理
     const [settingsModalVisible, setSettingsModalVisible] = useState(false);
 
-    const handleExitClick = (): void => {
-      setExitModalVisible(true);
-    };
-
-    const handleExitModalClose = (): void => {
-      setExitModalVisible(false);
-    };
-
     const handleSettingsClick = (): void => {
       setSettingsModalVisible(true);
     };
@@ -48,14 +27,10 @@ const SystemZone = forwardRef<HTMLDivElement, SystemZoneProps>(
       <Row
         ref={ref}
         style={{
-          position: 'sticky',
           flex: '0 0 auto',
-          bottom: 0,
-          left: 0,
           width: '100%',
           justifyContent: 'center',
           padding: '16px 0',
-          boxShadow: '0 -2px 5px rgba(0,0,0,0.1)',
         }}
       >
         <style>{`
@@ -93,80 +68,8 @@ const SystemZone = forwardRef<HTMLDivElement, SystemZoneProps>(
               defaultMessage={'nav.config'}
             />
           </IconButton>
-
-          <IconButton
-            icon={
-              login ? (
-                avatarUrl ? (
-                  <Icon
-                    module="module-common"
-                    name="btn_3DCam_AIView"
-                    userId="user-A"
-                    theme="default"
-                    size="2x"
-                    state="normal"
-                    url={avatarUrl}
-                  />
-                ) : (
-                  <Icon
-                    module="module-security"
-                    name="user-not-login"
-                    userId="user-A"
-                    theme="default"
-                    size="2x"
-                    state="normal"
-                  />
-                )
-              ) : (
-                <Icon
-                  module="module-common"
-                  name="user-not-login"
-                  userId="user-A"
-                  theme="default"
-                  size="2x"
-                  state="normal"
-                />
-              )
-            }
-            iconPlace="left"
-            iconSize={32}
-            type="default"
-            block
-            style={{ padding: '4px 16px' }}
-            onClick={() => showNotImplemented('我的')}
-          >
-            {login ? username : '未登录'}
-          </IconButton>
-
-          <IconButton
-            data-testid="exit-button"
-            icon={
-              <Icon
-                module="module-common"
-                name="btn_3DCam_AIView"
-                userId="user-A"
-                theme="default"
-                size="2x"
-                state="normal"
-              />
-            }
-            iconPlace="left"
-            iconSize={32}
-            type="default"
-            block
-            style={{ padding: '4px 16px' }}
-            onClick={handleExitClick}
-          >
-            <FormattedMessage
-              id="nav.logout"
-              defaultMessage={'nav.logout'}
-            />
-          </IconButton>
         </Space>
 
-        {/* 退出选择弹框 */}
-        <ExitModal visible={exitModalVisible} onClose={handleExitModalClose} />
-
         {/* 系统设置弹框 */}
         <SettingsModal
           visible={settingsModalVisible}
@@ -178,3 +81,4 @@ const SystemZone = forwardRef<HTMLDivElement, SystemZoneProps>(
 );
 
 export default SystemZone;
+