diff --git a/src/main.jsx b/src/main.jsx index 38a7f0c..01c1118 100644 --- a/src/main.jsx +++ b/src/main.jsx @@ -2,23 +2,22 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import { configure } from 'mobx'; import { createBrowserRouter, RouterProvider } from 'react-router-dom'; -import { AuthContext } from '@/stores/AuthContext'; -import { ThemeContext } from '@/stores/ThemeContext'; -import ConversationProvider from '@/views/Conversations/ConversationProvider'; -import Auth from '@/stores/Auth'; -import App from '@/views/App'; -import Standlone from '@/views/Standlone'; -import OrderFollow from '@/views/OrderFollow'; -import ChatHistory from '@/views/ChatHistory'; -import SalesManagement from '@/views/SalesManagement'; -import DingdingQRCode from '@/views/DingdingQRCode'; -import DingdingCallbak from '@/views/DingdingCallbak'; -import AccountProfile from '@/views/AccountProfile'; -import ErrorPage from '@/views/ErrorPage'; +import { AuthContext } from '@/stores/AuthContext' +import { ThemeContext } from '@/stores/ThemeContext' +import ConversationProvider from '@/views/Conversations/ConversationProvider' +import Auth from '@/stores/Auth' +import App from '@/views/App' +import Standlone from '@/views/Standlone' +import OrderFollow from '@/views/OrderFollow' +import ChatHistory from '@/views/ChatHistory' +import SalesManagement from '@/views/SalesManagement' +import DingdingQRCode from '@/views/DingdingQRCode' +import AccountProfile from '@/views/AccountProfile' +import ErrorPage from '@/views/ErrorPage' -import Conversations from '@/views/Conversations/ChatWindow'; -// import Conversations from '@/views/Conversations/ChatApp'; -import '@/assets/index.css'; +import Conversations from '@/views/Conversations/ChatWindow' +// import Conversations from '@/views/Conversations/ChatApp' +import '@/assets/index.css' configure({ useProxies: 'ifavailable', @@ -48,7 +47,6 @@ const router = createBrowserRouter([ element: , children: [ { path: 'dingding/qrcode', element: }, - { path: 'dingding/callback', element: }, ], }, ]); diff --git a/src/views/AccountProfile.jsx b/src/views/AccountProfile.jsx index 1a4421b..e7b3637 100644 --- a/src/views/AccountProfile.jsx +++ b/src/views/AccountProfile.jsx @@ -22,10 +22,10 @@ function AccountProfile() { - ​骆梅玉​ - +86-15878301602 - christyluo@hainatravel.com - 海纳业务组-GH事业部群-GH销售 + {loginUser.username}​ + {loginUser.accountName} + {loginUser.stateCode} {loginUser.mobile} + {loginUser.email} diff --git a/src/views/App.jsx b/src/views/App.jsx index e0086ff..4bb5dc4 100644 --- a/src/views/App.jsx +++ b/src/views/App.jsx @@ -15,7 +15,7 @@ import { isEmpty } from '@/utils/commons'; const { Header, Footer, Content } = Layout const { Title } = Typography -// SecurityApp +// AuthApp function App() { const { colorPrimary, borderRadius } = useThemeContext() diff --git a/src/views/DingdingCallbak.jsx b/src/views/DingdingCallbak.jsx deleted file mode 100644 index 7ca7491..0000000 --- a/src/views/DingdingCallbak.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import React, { useEffect } from 'react' -import { useParams, useNavigate } from 'react-router-dom' -import { Card, Typography, Flex, Result, Button } from 'antd' -import { useRequest } from 'ahooks' - -const { Title } = Typography -const { Meta } = Card - -import { useAuthContext } from '@/stores/AuthContext' - -function DingdingCallbak() { - - const navigate = useNavigate() - const params = new URLSearchParams(window.location.search) - const code = params.get('code') - const state = params.get('state') - - console.info('code: ' + code) - console.info('state: ' + state) - - const { loginUser, permissionList } = useAuthContext() - console.info('loginUser: ') - console.info(loginUser) - console.info('permissionList: ') - console.info(permissionList) - - - // const { data, error, loading } = useRequest(() => { - // return new Promise((resolve) => { - // setTimeout(() => { - // resolve('use Request data...'); - // }, 1000); - // }); - // }); - setTimeout(() => { - loginUser.userId = 999 - loginUser.openId = '987654321' - navigate('/s/account/profile') - }, 1000); - - useEffect(() => { - }, []) - - return ( - - 正在获取你的权限，请稍等 - - - ) -} - -export default DingdingCallbak; \ No newline at end of file diff --git a/src/views/DingdingQRCode.jsx b/src/views/DingdingQRCode.jsx index 34584e3..3c091a4 100644 --- a/src/views/DingdingQRCode.jsx +++ b/src/views/DingdingQRCode.jsx @@ -1,15 +1,21 @@ -import { Card, Flex, Typography } from 'antd' -import React, { useEffect } from 'react' +import { Result, Spin, Flex, Typography } from 'antd' +import React, { useEffect, useState } from 'react' +import { useNavigate } from 'react-router-dom' + +import { useAuthContext } from '@/stores/AuthContext' const { Title } = Typography -const { Meta } = Card // 钉钉扫码开发文档：https://open.dingtalk.com/document/orgapp/tutorial-obtaining-user-personal-information#title-qpi-0qv-anm function DingdingQRCode() { + const navigate = useNavigate() + const { loginUser } = useAuthContext() + const [loginStatus, setLoginStatus] = useState(0) + useEffect(() => { - import('https://g.alicdn.com/dingding/h5-dingtalk-login/0.21.0/ddlogin.js').then((module) => { + import('https://g.alicdn.com/dingding/h5-dingtalk-login/0.21.0/ddlogin.js').then(() => { window.DTFrameLogin( { id: 'qrCodeContainer', @@ -17,34 +23,76 @@ function DingdingQRCode() { height: 300, }, { - redirect_uri: encodeURIComponent('https://sales.mycht.cn/dingding/callback'), + redirect_uri: encodeURIComponent('https://sales.mycht.cn/p/dingding/callback'), client_id: 'dingwgdx6emlxr3fcrg8', scope: 'openid', response_type: 'code', - state: 'state1111', + state: 'global-sales', prompt: 'consent', }, (loginResult) => { - const { redirectUrl, authCode, state } = loginResult - // 这里可以直接进行重定向 - window.location.href = redirectUrl - // 也可以在不跳转页面的情况下，使用code进行授权 - console.log(authCode) + const { authCode } = loginResult + console.log(loginResult) + setLoginStatus(200) + + fetch(`https://p9axztuwd7x8a7.mycht.cn/dingtalk/dingtalkwork/WhatsAppAuth?authCode=${authCode}`) + .then(response => response.json()) + .then(json => { + // {"errcode":0,"errmsg":"ok","result":{"nick":"廖一军","unionId":"j7cuUCplZe1ZiiqjQNUUmFwiEiE","avatarUrl":"https://static-legacy.dingtalk.com/media/lALPBDDrhXr716HNAoDNAoA_640_640.png","openId":"iioljiPmZ4RPoOYpkFiSn7IKAiEiE","mobile":"18777396951","stateCode":"86","email":"lyj@hainatravel.com","opisn":"383"}} + if (json.errcode === 0) { + loginUser.userId = json.result.opisn + loginUser.accountName = json.result.opisn + loginUser.username = json.result.nick + loginUser.avatarUrl = json.result.avatarUrl + loginUser.stateCode = json.result.stateCode + loginUser.mobile = json.result.mobile + loginUser.email = json.result.email + loginUser.openId = json.result.openId + navigate('/account/profile') + } else { + setLoginStatus(403) + } + }) }, (errorMsg) => { - // 这里一般需要展示登录失败的具体原因 - alert(`Login Error: ${errorMsg}`) + setLoginStatus(403) + console.error(`Login Error: ${errorMsg}`) }, ) }) }, []) - return ( - - 使用钉钉扫码 -
- - ) + if (loginStatus === 200) { + return ( + + + ]} + /> + + ) + } else if (loginStatus === 403) { + return ( + + + + ) + } else { + return ( + + 使用钉钉扫码 +
+ + ) + } } export default DingdingQRCode \ No newline at end of file diff --git a/src/views/OrderFollow.jsx b/src/views/OrderFollow.jsx index 624cf9d..6fdd417 100644 --- a/src/views/OrderFollow.jsx +++ b/src/views/OrderFollow.jsx @@ -1,8 +1,8 @@ import { useNavigate } from 'react-router-dom' import { memo, useMemo, useCallback, useEffect, useState } from 'react' import { - Row, Col, Divider, Table, Card, Button, Input, - Space, Segmented, Radio, Select, Flex, Spin, Form, Switch, DatePicker, List, Avatar + Row, Badge, Divider, Table, Card, Button, Input, + Space, Tag, Radio, Select, Flex, Spin, Form, Switch, DatePicker, List, Avatar } from 'antd' import { StarFilled, ZoomInOutlined, StarOutlined, BarsOutlined, AppstoreOutlined, SearchOutlined @@ -83,29 +83,11 @@ const columns = [ title: '订单号', dataIndex: 'orderNumber', key: 'orderNumber', - width: 300, - render: (text, record, inde) => { - return ( - - {text} - - - ) + width: 222, + render: (text, record, index) => { + if (index === 1) return {text}重点 + else if (index === 2) return {text}潜力 + else return {text}休眠 } }, { @@ -116,6 +98,13 @@ const columns = [ return ( {text} + ) } @@ -125,42 +114,11 @@ const columns = [ dataIndex: 'orderStatus', key: 'orderStatus', width: 120, - render: (text, record, inde) => { - return ( - + + + + + + + + + + + + ) +}) -function SalesManagement() { +const SalesTable = function({formValues}) { + console.info('SalesTable') + console.info(formValues) - const keywordProps = useFormInput('') - const countryList = useGetJson(`https://p9axztuwd7x8a7.mycht.cn/service-InfoSys/InfoSys/GetCountryList`) - console.info(countryList) + const isMounted = useRef(false) + + const [salesData, setSalesData] = useState([]) + const [loading, setLoading] = useState(false) useEffect(() => { + console.info('SalesTable.useEffect') + console.info(isMounted) + setLoading(true) + // setSalesData([]) // 可改为设置加载状态 + setTimeout(() => { + const randomData = dataSource.map(data => { + data.important = Math.floor(Math.random() * (100 - 2 + 1) + 2) + return data + }) + setSalesData([...randomData]) + setLoading(false) + }, 1000) + isMounted.current = true + }, [formValues]) + + const columns = [ + { + title: '顾问', + dataIndex: 'travelAdvisor', + key: 'travelAdvisor', + }, + { + title: '重点订单', + dataIndex: 'important', + key: 'important', + }, + { + title: '潜力客户', + dataIndex: 'star', + key: 'star', + }, + { + title: '成型', + dataIndex: 'ing', + key: 'ing', + }, + ] + return ( + + ) +} + +function SalesManagement() { + + const [formValues, setFormValues] = useState({}) + + const handleSubmit = useCallback((values) => { + setFormValues({...values}) }, []) - + return ( - - - - - - - - - - - - - - - + <> + - -
- - + + ) } diff --git a/vite.config.js b/vite.config.js index 505e794..a5b5f14 100644 --- a/vite.config.js +++ b/vite.config.js @@ -17,29 +17,18 @@ export default defineConfig({ sourcemap: true, manifest: true, chunkSizeWarningLimit: 555, - rollupOptions: { - output: { - manualChunks(id) { - // if (id.includes('antd')) { - // console.info('chunk: ' + id) - // return 'antd-component' - // } else if (id.includes('rc-')) { - // return 'rc-component' - // } else if (id.includes('ant-design')) { - // return 'ant-design' - // } else { - // // console.info('chunk: ' + id) - // } - if (id.includes('node_modules')) { - return id.toString().split('node_modules/')[1].split('/')[0].toString(); - } - }, - chunkFileNames: (chunkInfo) => { - const facadeModuleId = chunkInfo.facadeModuleId ? chunkInfo.facadeModuleId.split('/') : []; - // const fileName = facadeModuleId[facadeModuleId.length - 2] || '[name]'; - return `assets/[name].[hash].js`; - } - } - } + // rollupOptions: { + // output: { + // manualChunks(id) { + // if (id.includes('node_modules')) { + // return id.toString().split('node_modules/')[1].split('/')[0].toString(); + // } + // }, + // chunkFileNames: (chunkInfo) => { + // const facadeModuleId = chunkInfo.facadeModuleId ? chunkInfo.facadeModuleId.split('/') : []; + // return `assets/[name].[hash].js`; + // } + // } + // } } })