Merge remote-tracking branch 'origin/main' into dev/chat

src/hooks/useFormInput.js

@@ -0,0 +1,16 @@
+import { useState } from 'react'
+
+export function useFormInput(initialValue) {
+  const [value, setValue] = useState(initialValue);
+
+  function handleChange(e) {
+    setValue(e.target.value);
+  }
+
+  const inputProps = {
+    value: value,
+    onChange: handleChange
+  };
+
+  return inputProps;
+}

src/hooks/userFetch.js

@@ -0,0 +1,36 @@
+import { useEffect, useState } from 'react'
+
+function checkStatus(response) {
+  if (response.status >= 200 && response.status < 300) {
+    return response
+  } else {
+    const message =
+      'Fetch error: ' + response.url + ' ' + response.status + ' (' +
+      response.statusText + ')'
+    const error = new Error(message)
+    error.response = response
+    throw error
+  }
+}
+
+export function useJson(url) {
+  const [data, setData] = useState(null)
+  useEffect(() => {
+    if (url) {
+      let ignore = false
+      fetch(url)
+        .then(checkStatus)
+        .then(response => response.json())
+        .then(json => {
+          if (!ignore) {
+            setData(json)
+          }
+        })
+      return () => {
+        ignore = true
+      }
+    }
+  }, [url])
+
+  return data
+}

src/main.jsx

@@ -6,6 +6,7 @@ import {
   RouterProvider,
 } from 'react-router-dom'
 import { AuthContext } from '@/stores/AuthContext'
+import { ThemeContext } from '@/stores/ThemeContext'
 import Auth from '@/stores/Auth'
 import App from '@/views/App'
 import Standlone from '@/views/Standlone'
@@ -59,15 +60,16 @@ const router = createBrowserRouter([
   }
 ])
 
-const auth = new Auth();
-
 ReactDOM.createRoot(document.getElementById('root')).render(
+  
   // <React.StrictMode>
-    <AuthContext.Provider value={auth}>
+  <ThemeContext.Provider value={{colorPrimary: '#1ba784', borderRadius: 4}}>
+    <AuthContext.Provider value={{loginUser: {userId: 1, openId: '123456789'}, permissionList: []}}>
       <RouterProvider
         router={router}
         fallbackElement={() => <div>Loading...</div>}
       />
     </AuthContext.Provider>
+  </ThemeContext.Provider>
   // </React.StrictMode>
 )

src/stores/Auth.js

@@ -5,8 +5,14 @@ class Auth {
   constructor() {
   }
 
+  //
+
+  // loginUser:
+
   // HT 账号 OP_SN
   userId = 1
+
+  openId = '123456789'
 }
 
 export default Auth

src/stores/AuthContext.js

@@ -1,7 +1,7 @@
 import { createContext, useContext } from 'react'
 
-export const AuthContext = createContext(null)
+export const AuthContext = createContext({})
 
-export function useAuth() {
+export function useAuthContext() {
   return useContext(AuthContext)
 }

src/stores/ThemeContext.js

@@ -0,0 +1,7 @@
+import { createContext, useContext } from 'react'
+
+export const ThemeContext = createContext({})
+
+export function useThemeContext() {
+  return useContext(ThemeContext)
+}

src/views/AccountProfile.jsx

@@ -4,11 +4,14 @@ import {
   Row, Col, Space, Descriptions, Avatar
 } from 'antd'
 
-import { useAuth } from '@/stores/AuthContext.js'
+import { useAuthContext } from '@/stores/AuthContext.js'
 
-function AccountProfile() {  
-  const auth = useAuth()
-  console.info('useAuth: ' + auth.userId)
+function AccountProfile() {
+  const { loginUser, permissionList } = useAuthContext()
+  console.info('loginUser: ')
+  console.info(loginUser)
+  console.info('permissionList: ')
+  console.info(permissionList)
 
   useEffect(() => {
     // 测试错误捕获：

src/views/App.jsx

@@ -4,7 +4,7 @@ import { Layout, Menu, ConfigProvider, theme, Empty, Row, Col, Dropdown, Space,
 import { DownOutlined } from "@ant-design/icons";
 import ErrorBoundary from '@/components/ErrorBoundary';
 import zhLocale from 'antd/locale/zh_CN';
-import dayjs from 'dayjs';
+import { useThemeContext } from '@/stores/ThemeContext'
 import 'dayjs/locale/zh-cn';
 
 import 'react-chat-elements/dist/main.css'
@@ -17,6 +17,7 @@ const { Title } = Typography
 
 function App() {
 
+  const {colorPrimary, borderRadius} = useThemeContext()
   const href = useHref()
   //const shouldBeLogin = (isEmpty(userId) || isEmpty(website)) && (href.indexOf('/authorise/') == -1)
   let defaultPath = 'follow'
@@ -120,8 +121,8 @@ function App() {
     <ConfigProvider
       theme={{
         token: {
-          colorPrimary: '#1ba784',
-          borderRadius: 4
+          colorPrimary: colorPrimary,
+          borderRadius: borderRadius
         },
         algorithm: theme.defaultAlgorithm,
       }}

src/views/DingdingCallbak.jsx

@@ -6,7 +6,7 @@ import { useRequest } from 'ahooks'
 const { Title } = Typography
 const { Meta } = Card
 
-import { useAuth } from '@/stores/AuthContext.js'
+import { useAuthContext } from '@/stores/AuthContext.js'
 
 function DingdingCallbak() {
 
@@ -18,10 +18,12 @@ function DingdingCallbak() {
   console.info('code: ' + code)
   console.info('state: ' + state)
   
-  const auth = useAuth()
-  console.info('useAuth: ' + auth.userId)
+  const { loginUser, permissionList } = useAuthContext()
+  console.info('loginUser: ')
+  console.info(loginUser)
+  console.info('permissionList: ')
+  console.info(permissionList)
 
-  auth.userId = 3344343
 
   // const { data, error, loading } = useRequest(() => {
   //   return new Promise((resolve) => {
@@ -31,6 +33,8 @@ function DingdingCallbak() {
   //   });
   // });
   setTimeout(() => {
+    loginUser.userId = 999
+    loginUser.openId = '987654321'
     navigate('/s/account/profile')
   }, 1000);
 

src/views/SalesManagement.jsx

@@ -8,6 +8,9 @@ import {
   StarFilled, ZoomInOutlined, StarOutlined, SearchOutlined, ImportOutlined
 } from '@ant-design/icons'
 
+import {useFormInput} from '@/hooks/useFormInput'
+import {useJson} from '@/hooks/userFetch'
+
 const { Search } = Input;
 const { RangePicker } = DatePicker;
 
@@ -99,7 +102,11 @@ const columns = [
 ];
 
 function SalesManagement() {
-  
+
+  const keywordProps = useFormInput('')
+  const countryList = useJson(`https://p9axztuwd7x8a7.mycht.cn/service-InfoSys/InfoSys/GetCountryList`)
+  console.info(countryList)
+
   useEffect(() => {
   }, [])
   
@@ -111,13 +118,10 @@ function SalesManagement() {
         <RangePicker />
           </Col>
         <Col span={6}>
-        <Search
-          placeholder="关键词"
-          allowClear
-          onSearch={()=>{}}
-        />
+        <Input placeholder='关键词' {...keywordProps} />
           </Col>
         <Col span={6}>
+          <Button icon={<ImportOutlined />} onClick={() => {console.info(keywordProps.value)}}>OK</Button>
           <Button icon={<ImportOutlined />}>导入联系人</Button>
           </Col>
         </Row>

src/views/Standlone.jsx

@@ -4,7 +4,7 @@ import { Layout, Menu, ConfigProvider, theme, Empty, Row, Col, Dropdown, Space,
 import { DownOutlined } from "@ant-design/icons";
 import '@/assets/App.css'
 import AppLogo from '@/assets/logo-gh.png'
-import { useStore } from '@/stores/StoreContext.js'
+import { useThemeContext } from '@/stores/ThemeContext'
 import { isEmpty } from '@/utils/commons'
 
 const { Header, Footer, Content } = Layout
@@ -28,6 +28,9 @@ const items = [
 	},
 ];
 function Standlone() {
+
+  const {colorPrimary, borderRadius} = useThemeContext()
+
   const {
     token: { colorBgContainer },
   } = theme.useToken()
@@ -83,8 +86,8 @@ function Standlone() {
     <ConfigProvider
       theme={{
         token: {
-          colorPrimary: '#1ba784',
-          borderRadius: 4
+          colorPrimary: colorPrimary,
+          borderRadius: borderRadius
         },
         algorithm: theme.defaultAlgorithm,
       }}