Global-sales/src/views/Standlone.jsx

import { Outlet, Link, useHref, NavLink } from 'react-router-dom'
import { useRef, useEffect, useState } from 'react'
import { Layout, Menu, ConfigProvider, theme, Empty, Row, Col, Dropdown, Space, Typography, Result, App as AntApp } from 'antd'
import { DownOutlined } from "@ant-design/icons";
import '@/assets/App.css'
import AppLogo from '@/assets/logo-gh.png'
import { useThemeContext } from '@/stores/ThemeContext'
import { isEmpty } from '@/utils/commons'

const { Header, Footer, Content } = Layout
const { Title } = Typography

const items = [
	{
		label: <Link to="/account/change-password">Change password</Link>,
		key: "0",
	},
	{
		label: <Link to="/account/profile">Profile</Link>,
		key: "1",
	},
	{
		type: "divider",
	},
	{
		label: <Link to="/login?out">Logout</Link>,
		key: "3",
	},
];
function Standlone() {

  const {colorPrimary, borderRadius} = useThemeContext()

  const {
    token: { colorBgContainer },
  } = theme.useToken()

  function globalEmpty() {
    return (
      <Empty description={false} />
    )
  }

  function renderLogin() {
    return (
      <Result
        status='403'
        title='授权失败'
        subTitle='请登陆信息平台，通过指定链接打开。'
      />
    )
  }

  function renderLayout() {
    return (
      <Layout>
        <Header className='header' style={{ position: 'sticky', top: 0, zIndex: 1, width: '100%', background: 'white' }}>
          <Row gutter={{ md: 24 }} align='middle'>
            <Col flex="auto" style={{ color: "white", marginBottom: "0", display: "flex", justifyContent: "center" }}>
              <NavLink to='/'>
                <img src={AppLogo} className='logo' alt='App logo' />
              </NavLink>
              <Title level={3}>
              聊天式销售平台
              </Title>
            </Col>
          </Row>
        </Header>
        <Layout>
          <Content
            style={{
              padding: 24,
              margin: 0,
              minHeight: 280,
              background: colorBgContainer,
            }}>
            <Outlet />
          </Content>
        </Layout>
        <Footer>桂林海纳国际旅行社有限公司</Footer>
      </Layout>
    )
  }

  return (
    <ConfigProvider
      theme={{
        token: {
          colorPrimary: colorPrimary,
          borderRadius: borderRadius
        },
        algorithm: theme.defaultAlgorithm,
      }}
      renderEmpty={globalEmpty}
    >
      <AntApp>
        {renderLayout()}
      </AntApp>
    </ConfigProvider>
  )
}

export default Standlone