增加钉钉扫码登陆页面

src/main.jsx

@@ -8,7 +8,9 @@ import {
 import RootStore from '@/stores/Root'
 import { StoreContext } from '@/stores/StoreContext'
 import App from '@/views/App'
+import Standlone from '@/views/Standlone'
 import OrderFollow from '@/views/OrderFollow'
+import DingdingQRCode from '@/views/DingdingQRCode'
 
 configure({
   useProxies: 'ifavailable',
@@ -24,7 +26,13 @@ const router = createBrowserRouter([
     path: '/',
     element: <App />,
     children: [      
-      { index: true, element: <OrderFollow /> }
+      { index: true, element: <OrderFollow /> },
+    ]
+  },
+  {
+    element: <Standlone />,
+    children: [
+      { path: "/public/dingding", element: <DingdingQRCode /> },
     ]
   }
 ])

src/views/DingdingQRCode.jsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { QRCode, Result, Flex, Button } from 'antd';
+
+function DingdingQRCode() {
+  return (
+    <Flex justify='center' align='center'>
+      <QRCode
+        errorLevel="H"
+        size={300}
+        iconSize={300 / 4}
+        value="https://www.globalhighlights.com/"
+        icon="https://data.chinahighlights.com/image/aboutus/logo-gh.png"
+      />
+    </Flex>
+  )
+}
+
+export default DingdingQRCode;

src/views/Standlone.jsx

@@ -0,0 +1,114 @@
+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 { useStore } from '@/stores/StoreContext.js'
+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 href = useHref()
+  const { authStore } = useStore()
+  const { userId, website } = authStore
+  const shouldBeLogin = (isEmpty(userId) || isEmpty(website)) && (href.indexOf('/authorise/') == -1)
+  let defaultPath = 'follow'
+
+  if (href !== '/') {
+    const splitPath = href.split('/')
+
+    if (splitPath.length > 1) {
+      defaultPath = splitPath[2]
+    }
+  }
+  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: '#645822',
+          borderRadius: 4
+        },
+        algorithm: theme.defaultAlgorithm,
+      }}
+      renderEmpty={globalEmpty}
+    >
+      <AntApp>
+        {renderLayout()}
+      </AntApp>
+    </ConfigProvider>
+  )
+}
+
+export default Standlone