作者 韩昌

首页样式

1 -REACT_APP_NAME=why 1 +REACT_APP_NAME=hachiman
2 REACT_APP_AGE=18 2 REACT_APP_AGE=18
1 -REACT_APP_NAME=kobe 1 +REACT_APP_NAME=C
2 REACT_APP_AGE=30 2 REACT_APP_AGE=30
@@ -2,13 +2,10 @@ @@ -2,13 +2,10 @@
2 <html lang="en"> 2 <html lang="en">
3 <head> 3 <head>
4 <meta charset="utf-8" /> 4 <meta charset="utf-8" />
5 - <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> 5 + <link rel="icon" href="%PUBLIC_URL%/logo192.png" />
6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1" />
7 <meta name="theme-color" content="#000000" /> 7 <meta name="theme-color" content="#000000" />
8 - <meta  
9 - name="description"  
10 - content="Web site created using create-react-app"  
11 - /> 8 + <meta name="description" content="Web site created using create-react-app" />
12 <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> 9 <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
13 <!-- 10 <!--
14 manifest.json provides metadata used when your web app is installed on a 11 manifest.json provides metadata used when your web app is installed on a
@@ -24,7 +21,7 @@ @@ -24,7 +21,7 @@
24 work correctly both with client-side routing and a non-root public URL. 21 work correctly both with client-side routing and a non-root public URL.
25 Learn how to configure a non-root public URL by running `npm run build`. 22 Learn how to configure a non-root public URL by running `npm run build`.
26 --> 23 -->
27 - <title>React App</title> 24 + <title>宠物问诊后台管理</title>
28 </head> 25 </head>
29 <body> 26 <body>
30 <noscript>You need to enable JavaScript to run this app.</noscript> 27 <noscript>You need to enable JavaScript to run this app.</noscript>
@@ -3,7 +3,6 @@ import { useRoutes } from 'react-router-dom' @@ -3,7 +3,6 @@ import { useRoutes } from 'react-router-dom'
3 import routes from './router' 3 import routes from './router'
4 import { useAppSelector, useAppDispatch, shallowEqualApp } from './store' 4 import { useAppSelector, useAppDispatch, shallowEqualApp } from './store'
5 import { changeMessage } from './store/modules/counter' 5 import { changeMessage } from './store/modules/counter'
6 -import AppHeader from './components/appHeader'  
7 6
8 function App() { 7 function App() {
9 const { counter } = useAppSelector((state) => state, shallowEqualApp) 8 const { counter } = useAppSelector((state) => state, shallowEqualApp)
@@ -11,9 +10,11 @@ function App() { @@ -11,9 +10,11 @@ function App() {
11 function changeMessageHandler() { 10 function changeMessageHandler() {
12 dispatch(changeMessage('hahah')) 11 dispatch(changeMessage('hahah'))
13 } 12 }
  13 +
  14 + const loginState: boolean = Boolean(localStorage.getItem('token'))
  15 +
14 return ( 16 return (
15 <> 17 <>
16 - <AppHeader />  
17 <Suspense fallback="loading..."> 18 <Suspense fallback="loading...">
18 <div className="App">{useRoutes(routes)}</div> 19 <div className="App">{useRoutes(routes)}</div>
19 </Suspense> 20 </Suspense>
  1 +import hyRequest from "@/service";
  2 +
  3 +export const getTopBanner = () => hyRequest.get({ url: '/banner' })
1 1
  2 +.flexX{
  3 + display: flex;
  4 +}
2 5
3 .flexJ { 6 .flexJ {
4 display: flex; 7 display: flex;
1 -[  
2 - {  
3 - "title": "发现音乐",  
4 - "type": "path",  
5 - "link": "/discover"  
6 - },  
7 - {  
8 - "title": "我的音乐",  
9 - "type": "path",  
10 - "link": "/mine"  
11 - },  
12 - {  
13 - "title": "关注",  
14 - "type": "path",  
15 - "link": "/focus"  
16 - },  
17 - {  
18 - "title": "商城",  
19 - "type": "link",  
20 - "link": "https://music.163.com/store/product"  
21 - },  
22 - {  
23 - "title": "音乐人",  
24 - "type": "link",  
25 - "link": "https://music.163.com/st/musician"  
26 - },  
27 - {  
28 - "title": "下载客户端",  
29 - "type": "path",  
30 - "link": "/download"  
31 - }  
32 -]  
1 -export const headerLinks = [  
2 - {  
3 - title: '发现音乐',  
4 - link: '/discover'  
5 - },  
6 - {  
7 - title: '我的音乐',  
8 - link: '/mine'  
9 - },  
10 - {  
11 - title: '朋友',  
12 - link: '/friend'  
13 - },  
14 - {  
15 - title: '商城',  
16 - link: 'https://music.163.com/store/product'  
17 - },  
18 - {  
19 - title: '音乐人',  
20 - link: 'https://music.163.com/nmusician/web/index#/'  
21 - },  
22 - {  
23 - title: '下载客户端',  
24 - link: 'https://music.163.com/#/download'  
25 - }  
26 -]  
27 -  
28 -export const footerLinks = [  
29 - {  
30 - title: '服务条款',  
31 - link: 'https://st.music.163.com/official-terms/service'  
32 - },  
33 - {  
34 - title: '隐私政策',  
35 - link: 'https://st.music.163.com/official-terms/privacy'  
36 - },  
37 - {  
38 - title: '儿童隐私政策',  
39 - link: 'https://st.music.163.com/official-terms/children'  
40 - },  
41 - {  
42 - title: '版权投诉指引',  
43 - link: 'https://music.163.com/st/staticdeal/complaints.html'  
44 - },  
45 - {  
46 - title: '意见反馈',  
47 - link: '#'  
48 - }  
49 -]  
50 -  
51 -export const footerImages = [  
52 - {  
53 - link: 'https://music.163.com/st/userbasic#/auth'  
54 - },  
55 - {  
56 - link: 'https://music.163.com/recruit'  
57 - },  
58 - {  
59 - link: 'https://music.163.com/web/reward'  
60 - },  
61 - {  
62 - link: 'https://music.163.com/uservideo#/plan'  
63 - }  
64 -]  
65 -  
66 -// discover中的数据  
67 -export const discoverMenu = [  
68 - {  
69 - title: '推荐',  
70 - link: '/discover/recommend'  
71 - },  
72 - {  
73 - title: '排行榜',  
74 - link: '/discover/ranking'  
75 - },  
76 - {  
77 - title: '歌单',  
78 - link: '/discover/songs'  
79 - },  
80 - {  
81 - title: '主播电台',  
82 - link: '/discover/djradio'  
83 - },  
84 - {  
85 - title: '歌手',  
86 - link: '/discover/artist'  
87 - },  
88 - {  
89 - title: '新碟上架',  
90 - link: '/discover/album'  
91 - }  
92 -]  
93 -  
94 -// 热门主播  
95 -export const hotRadios = [  
96 - {  
97 - picUrl:  
98 - 'http://p1.music.126.net/H3QxWdf0eUiwmhJvA4vrMQ==/1407374893913311.jpg',  
99 - name: '陈立',  
100 - position: '心理学家、美食家陈立教授',  
101 - url: '/user/home?id=278438485'  
102 - },  
103 - {  
104 - picUrl:  
105 - 'http://p1.music.126.net/y5-sM7tjnxnu_V9LWKgZlw==/7942872001461517.jpg',  
106 - name: 'DJ艳秋',  
107 - position: '著名音乐节目主持人',  
108 - url: '/user/home?id=91239965'  
109 - },  
110 - {  
111 - picUrl:  
112 - 'http://p1.music.126.net/6cc6lgOfQTo6ovNnTHPyJg==/3427177769086282.jpg',  
113 - name: '国家大剧院古典音乐频道',  
114 - position: '国家大剧院古典音乐官方',  
115 - url: '/user/home?id=324314596'  
116 - },  
117 - {  
118 - picUrl:  
119 - 'http://p1.music.126.net/xa1Uxrrn4J0pm_PJwkGYvw==/3130309604335651.jpg',  
120 - name: '谢谢收听',  
121 - position: '南京电台主持人王馨',  
122 - url: '/user/home?id=1611157'  
123 - },  
124 - {  
125 - picUrl:  
126 - 'http://p1.music.126.net/slpd09Tf5Ju82Mv-h8MP4w==/3440371884651965.jpg',  
127 - name: 'DJ晓苏',  
128 - position: '独立DJ,CRI环球旅游广播特邀DJ',  
129 - url: '/user/home?id=2313954'  
130 - }  
131 -]  
132 -  
133 -// 歌手类别  
134 -export const artistCategories = [  
135 - {  
136 - title: '推荐',  
137 - area: -1,  
138 - artists: [  
139 - {  
140 - name: '推荐歌手',  
141 - type: 1,  
142 - url: '/discover/artist',  
143 - id: 0  
144 - },  
145 - {  
146 - name: '入驻歌手',  
147 - type: 2,  
148 - url: '/discover/artist?cat=5001',  
149 - dataPath: '/artist/list?cat=5001'  
150 - }  
151 - ]  
152 - },  
153 - {  
154 - title: '华语',  
155 - area: 7,  
156 - artists: [  
157 - {  
158 - name: '华语男歌手',  
159 - url: '/discover/artist?id=1001',  
160 - type: 1  
161 - },  
162 - {  
163 - name: '华语女歌手',  
164 - url: '/discover/artist?id=1002',  
165 - type: 2  
166 - },  
167 - {  
168 - name: '华语组合/乐队',  
169 - url: '/discover/artist?id=1003',  
170 - type: 3  
171 - }  
172 - ]  
173 - },  
174 - {  
175 - title: '欧美',  
176 - area: 96,  
177 - artists: [  
178 - {  
179 - name: '欧美男歌手',  
180 - url: '/discover/artist?id=2001',  
181 - type: 1  
182 - },  
183 - {  
184 - name: '欧美女歌手',  
185 - url: '/discover/artist?id=2002',  
186 - type: 2  
187 - },  
188 - {  
189 - name: '欧美组合乐队',  
190 - url: '/discover/artist?id=2003',  
191 - type: 3  
192 - }  
193 - ]  
194 - },  
195 - {  
196 - title: '日本',  
197 - area: 8,  
198 - artists: [  
199 - {  
200 - name: '日本男歌手',  
201 - url: '/discover/artist?id=6001',  
202 - type: 1  
203 - },  
204 - {  
205 - name: '日本女歌手',  
206 - url: '/discover/artist?id=6002',  
207 - type: 2  
208 - },  
209 - {  
210 - name: '日本组合/乐队',  
211 - url: '/discover/artist?id=6003',  
212 - type: 3  
213 - }  
214 - ]  
215 - },  
216 - {  
217 - title: '韩国',  
218 - area: 16,  
219 - artists: [  
220 - {  
221 - name: '韩国男歌手',  
222 - url: '/discover/artist?id=7001',  
223 - type: 1  
224 - },  
225 - {  
226 - name: '韩国女歌手',  
227 - url: '/discover/artist?id=7002',  
228 - type: 2  
229 - },  
230 - {  
231 - name: '韩国组合/乐队',  
232 - url: '/discover/artist?id=7003',  
233 - type: 3  
234 - }  
235 - ]  
236 - },  
237 - {  
238 - title: '其他',  
239 - area: 0,  
240 - artists: [  
241 - {  
242 - name: '其他男歌手',  
243 - url: '/discover/artist?id=4001',  
244 - type: 1  
245 - },  
246 - {  
247 - name: '其他女歌手',  
248 - url: '/discover/artist?id=4002',  
249 - type: 2  
250 - },  
251 - {  
252 - name: '其他组合乐队',  
253 - url: '/discover/artist?id=4003',  
254 - type: 3  
255 - }  
256 - ]  
257 - }  
258 -]  
@@ -15,6 +15,7 @@ export const AppHeaderWrapper = styled.div` @@ -15,6 +15,7 @@ export const AppHeaderWrapper = styled.div`
15 width: 40px; 15 width: 40px;
16 height: 40px; 16 height: 40px;
17 margin-right: 16px; 17 margin-right: 16px;
  18 + cursor: pointer;
18 } 19 }
19 .username{ 20 .username{
20 font-size: 20px; 21 font-size: 20px;
@@ -25,5 +26,6 @@ export const AppHeaderWrapper = styled.div` @@ -25,5 +26,6 @@ export const AppHeaderWrapper = styled.div`
25 .loginout{ 26 .loginout{
26 font-size: 18px; 27 font-size: 18px;
27 color: #fff; 28 color: #fff;
  29 + cursor: pointer;
28 } 30 }
29 ` 31 `
  1 +import React, { memo } from 'react'
  2 +import type { FC, ReactNode } from 'react'
  3 +import { Space, Spin } from 'antd'
  4 +
  5 +interface IProps {
  6 + children?: ReactNode
  7 +}
  8 +
  9 +const AppLoading: FC<IProps> = memo(() => {
  10 + return (
  11 + <Space size="middle">
  12 + <Spin size="large" />
  13 + </Space>
  14 + )
  15 +})
  16 +
  17 +export default AppLoading
  1 +import React, { memo, useState } from 'react'
  2 +import {
  3 + SnippetsOutlined,
  4 + AppstoreOutlined,
  5 + ContainerOutlined,
  6 + DesktopOutlined,
  7 + MailOutlined,
  8 + MenuFoldOutlined,
  9 + MenuUnfoldOutlined,
  10 + PieChartOutlined
  11 +} from '@ant-design/icons'
  12 +import type { FC, ReactNode } from 'react'
  13 +import { useNavigate } from 'react-router-dom'
  14 +import type { MenuProps } from 'antd'
  15 +import { Button, Menu } from 'antd'
  16 +import { AppMenyWrapper } from './styled'
  17 +
  18 +type MenuItem = Required<MenuProps>['items'][number]
  19 +
  20 +interface IProps {
  21 + children?: ReactNode
  22 +}
  23 +
  24 +function getItem(label: React.ReactNode, key: React.Key, icon?: React.ReactNode, children?: MenuItem[], type?: 'group'): MenuItem {
  25 + return {
  26 + key,
  27 + icon,
  28 + children,
  29 + label,
  30 + type
  31 + } as MenuItem
  32 +}
  33 +
  34 +const items: MenuItem[] = [
  35 + getItem('我的订单', '1', <SnippetsOutlined />),
  36 + getItem('暂不开放', '2', <DesktopOutlined />)
  37 + // getItem('Option 3', '3', <ContainerOutlined />),
  38 +
  39 + // getItem('Navigation One', 'sub1', <MailOutlined />, [getItem('Option 5', '5'), getItem('Option 6', '6'), getItem('Option 7', '7'), getItem('Option 8', '8')]),
  40 +
  41 + // getItem('Navigation Two', 'sub2', <AppstoreOutlined />, [
  42 + // getItem('Option 9', '9'),
  43 + // getItem('Option 10', '10'),
  44 +
  45 + // getItem('Submenu', 'sub3', null, [getItem('Option 11', '11'), getItem('Option 12', '12')])
  46 + // ])
  47 +]
  48 +
  49 +type ObjectString = {
  50 + [key: string]: string
  51 +}
  52 +
  53 +const navigateUrl: ObjectString = {
  54 + '1': '/discover/ConsultationOrder',
  55 + '2': '/discover/xx'
  56 +}
  57 +
  58 +const AppMenu: FC<IProps> = memo(() => {
  59 + const navigate = useNavigate()
  60 + const [collapsed, setCollapsed] = useState(false)
  61 +
  62 + const toggleCollapsed = () => {
  63 + setCollapsed(!collapsed)
  64 + }
  65 +
  66 + const onselectHandler = (e: any) => {
  67 + console.log(e, 'eee')
  68 + navigate(navigateUrl[e.key])
  69 + }
  70 +
  71 + return (
  72 + <AppMenyWrapper style={{ width: 256 }}>
  73 + <Menu
  74 + defaultSelectedKeys={['1']}
  75 + defaultOpenKeys={['sub1']}
  76 + mode="inline"
  77 + theme="dark"
  78 + inlineCollapsed={collapsed}
  79 + items={items}
  80 + onSelect={(e) => onselectHandler(e)}
  81 + />
  82 + </AppMenyWrapper>
  83 + )
  84 +})
  85 +
  86 +export default AppMenu
  1 +import styled from "styled-components";
  2 +
  3 +export const AppMenyWrapper = styled.div`
  4 +height: calc(100vh - 65px);
  5 +background: #001529;
  6 +`
@@ -2,22 +2,29 @@ import React, { lazy } from 'react' @@ -2,22 +2,29 @@ import React, { lazy } from 'react'
2 import { Navigate } from 'react-router-dom' 2 import { Navigate } from 'react-router-dom'
3 import type { RouteObject } from 'react-router-dom' 3 import type { RouteObject } from 'react-router-dom'
4 4
  5 +const XX = lazy(() => import('@/views/discover/view/xx'))
  6 +
5 // 路由懒加载 7 // 路由懒加载
6 const Discover = lazy(() => import('@/views/discover')) 8 const Discover = lazy(() => import('@/views/discover'))
7 -const Recommend = lazy(() => import('@/views/discover/view/recommend')) 9 +const ConsultationOrder = lazy(() => import('@/views/discover/view/ConsultationOrder'))
8 const Login = lazy(() => import('@/views/login')) 10 const Login = lazy(() => import('@/views/login'))
9 11
  12 +const loginState = Boolean(localStorage.getItem('token'))
  13 +
  14 +const path = loginState ? '/discover' : '/login'
  15 +
10 const routes: RouteObject[] = [ 16 const routes: RouteObject[] = [
11 - { path: '/', element: <Navigate to={'/login'} /> }, 17 + { path: '/', element: <Navigate to={path} /> },
12 { path: '/login', element: <Login /> }, 18 { path: '/login', element: <Login /> },
13 { 19 {
14 path: '/discover', 20 path: '/discover',
15 element: <Discover />, 21 element: <Discover />,
16 children: [ 22 children: [
17 - { path: '/discover', element: <Navigate to={'/discover/recommend'} /> },  
18 - { path: '/discover/recommend', element: <Recommend /> }, 23 + { path: '/discover', element: <Navigate to={'/discover/ConsultationOrder'} /> },
  24 + { path: '/discover/ConsultationOrder', element: <ConsultationOrder /> },
  25 + { path: '/discover/xx', element: <XX /> }
19 ] 26 ]
20 - }, 27 + }
21 ] 28 ]
22 29
23 export default routes 30 export default routes
1 import { configureStore } from "@reduxjs/toolkit"; 1 import { configureStore } from "@reduxjs/toolkit";
2 import { useSelector, useDispatch, TypedUseSelectorHook, shallowEqual } from 'react-redux' 2 import { useSelector, useDispatch, TypedUseSelectorHook, shallowEqual } from 'react-redux'
3 import counterReducer from './modules/counter' 3 import counterReducer from './modules/counter'
  4 +import orderReducer from './modules/order'
4 5
5 const store = configureStore({ 6 const store = configureStore({
6 reducer: { 7 reducer: {
7 - counter: counterReducer 8 + counter: counterReducer,
  9 + order: orderReducer
8 } 10 }
9 }) 11 })
10 12
  1 +import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
  2 +import { getTopBanner } from '@/api'
  3 +
  4 +export const fetchOrderDataAction = createAsyncThunk(
  5 + 'fetchdata',
  6 + (payload, { dispatch }) => {
  7 + // 1.顶部的banners
  8 + getTopBanner().then((res: any) => {
  9 + dispatch(changeBannerAction(res.banners))
  10 + })
  11 +
  12 + return null
  13 + }
  14 +)
  15 +
  16 +const orderSlice = createSlice({
  17 + name: 'order',
  18 + initialState: {
  19 + count: 100,
  20 + message: 'hello Redux',
  21 + name: 'HachimanC',
  22 + bannersList: []
  23 + },
  24 + reducers: {
  25 + changeBannerAction(state, { payload }) {
  26 + state.bannersList = payload
  27 + }
  28 + }
  29 +})
  30 +
  31 +export default orderSlice.reducer
  32 +
  33 +export const { changeBannerAction } = orderSlice.actions
  1 +export * from './result'
  1 +export interface Result<ResultType> {
  2 + code: number
  3 + message: string
  4 + result: ResultType
  5 + success: boolean
  6 + timestamp: number
  7 +}
  8 +
  9 +export interface PageListType<PageListItemType> {
  10 + records: PageListItemType[]
  11 + current: number
  12 + total: number
  13 + size: number
  14 +}
  15 +
  16 +export interface ConsultationOrderRecordsType {
  17 + id: string;
  18 + order_no: string;
  19 + petId: string;
  20 + petName: string;
  21 + petClass: string;
  22 + petType: number;
  23 + petSec: number;
  24 + isSterilization: number;
  25 + isAgain: number;
  26 + age: number;
  27 + weight: string;
  28 + symptom: string;
  29 + supplement: string;
  30 + image: string[];
  31 + remainder: number;
  32 + consultationState: number;
  33 + consultationWay: number;
  34 + immuneStatus: string;
  35 + feedType: string;
  36 + batheFrequency: string;
  37 + timeFrame: string;
  38 + payAmount: number;
  39 + realityPayAmount: number;
  40 + payTime: string;
  41 + amount: number;
  42 + prescriptionForm: string;
  43 + prescriptionFile: string;
  44 + award: number;
  45 + user: User;
  46 + doctor: Doctor;
  47 + time: string;
  48 + consultationay: number;
  49 + orderState: number;
  50 + effect_award: number;
  51 +}
  1 +import { BASE_URL } from '@/service/request/config'
  2 +
  3 +// immuneStatus: { 1:'',2:'',3: '',4: '' }
  4 +type ObjectString = {
  5 + [key: string]: {
  6 + [key: string]: string | number
  7 + }
  8 +}
  9 +
  10 +const GlobalData: ObjectString = {
  11 + 'examineState': { 0: '去认证', 10: '审核中', 30: '认证失败', 20: '认证成功' },
  12 + 'incomeTypeList': { 1: '问诊订单', 2: '提现' },
  13 + 'ReceivePatients': { 0: '暂不接诊', 1: '在线坐诊' },
  14 + 'sexData': { 0: '未知', 1: '男', 2: '女' },
  15 + 'MessageType': { 1: '系统通知', 2: '用户反馈' },
  16 + 'consultationWay': { 10: '快速问诊', 21: '专家图文语音问诊', 22: '专家视频问诊', 23: '专家电话问诊' },
  17 + 'isReply': { 0: '否', 1: '是' },
  18 + 'orderState': { 20: '待问诊', 30: '问诊中', 40: '问诊结束', 50: '已取消' },
  19 + 'state': { 0: '待发货', 1: '已发货', 2: '已完成', 3: '已退货' },
  20 + 'isSterilization': { 0: '否', 1: '是' }, // 是否绝育
  21 + 'petSec': { 0: '母', 1: '公' },
  22 + 'immuneStatus': { 1: '已免疫', 2: '未免疫', 3: '免疫不全', 4: '免疫不详' },
  23 + 'feedType': { 1: '配方粮', 2: '配方粮+零食', 3: '只吃人食物', 4: '自制犬猫粮' },
  24 + 'batheFrequency': { 1: '一周一次(狗狗)', 2: '洗澡频次不规律', 3: '想起来才洗', 4: '定期洗澡(猫猫)' },
  25 + 'timeFrame': { 1: '<7天', 2: '<1个月', 3: '<3个月', 4: '3个月以上' },
  26 + 'petType': { 10: '猫', 20: '狗', 30: '异宠' },
  27 + 'isAgain': { 1: '是', 0: '否' },
  28 + 'symptom': { 1: '呕吐', 2: '软便拉稀', 3: '皮肤问题', 4: '眼睛问题', 5: '泌尿问题', 6: '绝育', 7: '疫苗', 8: '驱虫', 9: '养护问题', 10: '其他' }
  29 +}
  30 +
  31 +export default {
  32 + optData(key: string) {
  33 + return GlobalData[key]
  34 + },
  35 + optObjectValue(object: string, key: string | number) {
  36 + return GlobalData[object][key] || ''
  37 + },
  38 + downFile(fileName: string) {
  39 + if (fileName == '' || fileName == undefined) return ''
  40 +
  41 + if (fileName.indexOf(BASE_URL) > -1 || fileName.indexOf('http://') > -1 || fileName.indexOf('https://') > -1) return fileName
  42 +
  43 + return BASE_URL + '/v1/public/downLoadPic?fileName=' + fileName
  44 + },
  45 + formatStr(str: string, val: string) {
  46 + if (str == null || str == undefined) return val || ''
  47 + return str
  48 + },
  49 +}
@@ -2,7 +2,9 @@ import React, { Suspense, memo } from 'react' @@ -2,7 +2,9 @@ import React, { Suspense, memo } from 'react'
2 import type { FC, ReactNode } from 'react' 2 import type { FC, ReactNode } from 'react'
3 import { NavLink, Outlet } from 'react-router-dom' 3 import { NavLink, Outlet } from 'react-router-dom'
4 import { DiscoverWrapper } from './style' 4 import { DiscoverWrapper } from './style'
5 -import { discoverMenu } from '@/assets/data/local-data' 5 +import AppHeader from '@/components/appHeader'
  6 +import AppMenu from '@/components/appMenu'
  7 +import AppLoading from '@/components/appLoading'
6 8
7 interface IProps { 9 interface IProps {
8 children?: ReactNode 10 children?: ReactNode
@@ -11,9 +13,15 @@ interface IProps { @@ -11,9 +13,15 @@ interface IProps {
11 const Discover: FC<IProps> = memo(() => { 13 const Discover: FC<IProps> = memo(() => {
12 return ( 14 return (
13 <DiscoverWrapper> 15 <DiscoverWrapper>
14 - <Suspense fallback="二级路由渲染">  
15 - <Outlet />  
16 - </Suspense> 16 + <AppHeader />
  17 +
  18 + <div className="flexX">
  19 + <AppMenu />
  20 +
  21 + <Suspense fallback={<AppLoading />}>
  22 + <Outlet />
  23 + </Suspense>
  24 + </div>
17 </DiscoverWrapper> 25 </DiscoverWrapper>
18 ) 26 )
19 }) 27 })
  1 +import hyRequest from '@/service'
  2 +import React, { memo, useEffect, useState } from 'react'
  3 +import type { FC, ReactNode } from 'react'
  4 +import { Tabs, Avatar, Space, Divider, Button, Modal, Pagination } from 'antd'
  5 +import type { TabsProps } from 'antd'
  6 +import { ConsultationOrderWrapper, ConsultationOrderItemWrapper } from './styled'
  7 +import { useAppDispatch, useAppSelector, shallowEqualApp } from '@/store'
  8 +import { fetchOrderDataAction } from '@/store/modules/order'
  9 +
  10 +interface IProps {
  11 + children?: ReactNode
  12 + orderList?: string[]
  13 +}
  14 +
  15 +const url = 'https://p1.ssl.qhmsg.com/dr/270_500_/t010c2d50907f0a7b9c.png'
  16 +
  17 +const ShowOrderComHandler: FC<IProps> = (props) => {
  18 + const { orderList } = props
  19 + const [open, setOpenHandler] = useState(false)
  20 + const [confirmLoading, setConfirmLoading] = useState(false)
  21 +
  22 + const showModalHandler = (flag: number) => {
  23 + console.log(flag, '按钮状态')
  24 + setOpenHandler(true)
  25 + }
  26 +
  27 + const handleOk = () => {
  28 + setConfirmLoading(true)
  29 + setTimeout(() => {
  30 + setOpenHandler(false)
  31 + setConfirmLoading(false)
  32 + }, 2000)
  33 + }
  34 +
  35 + const handleCancel = () => {
  36 + console.log('Clicked cancel button')
  37 + setOpenHandler(false)
  38 + }
  39 + return (
  40 + <ConsultationOrderItemWrapper>
  41 + <Modal title="Title" open={open} onOk={handleOk} cancelText="关闭" okText="确认" confirmLoading={confirmLoading} onCancel={handleCancel}>
  42 + <p>132</p>
  43 + </Modal>
  44 + {orderList?.length &&
  45 + orderList.map((_, index) => (
  46 + <div className="orderItem " key={index}>
  47 + <div className="topinfo flexJ">
  48 + <div className=" flexA">
  49 + <Avatar size="large" src={<img src={url} alt="avatar" />} />
  50 + <div className="username">卡卡罗特</div>
  51 + <div className="statetag flexC">图文问诊</div>
  52 + <div className="time">2023.10.07</div>
  53 + </div>
  54 + <div className="stateText">待问诊</div>
  55 + </div>
  56 + <div className="contenttext">
  57 + <span>就诊宠物:</span>蓝猫/2岁/女绝/育/1kg
  58 + </div>
  59 + <div className="contenttext">
  60 + <span>病情描述:</span>即该不低加造年周消养明价切公没家管发七议性原提何们领从很己发战
  61 + </div>
  62 + <Divider />
  63 + <div className="flexJ">
  64 + <div className="moneytext">
  65 + 预计收入
  66 + <span>¥26.00</span>
  67 + </div>
  68 + <div className="flexA">
  69 + <Space wrap>
  70 + <Button type="primary" shape="round" onClick={() => showModalHandler(1)}>
  71 + 查看症状
  72 + </Button>
  73 + <Button type="primary" shape="round" onClick={() => showModalHandler(2)}>
  74 + 发送处方单
  75 + </Button>
  76 + <Button type="primary" shape="round" onClick={() => showModalHandler(3)}>
  77 + 查看处方单
  78 + </Button>
  79 + </Space>
  80 + </div>
  81 + </div>
  82 + </div>
  83 + ))}
  84 + </ConsultationOrderItemWrapper>
  85 + )
  86 +}
  87 +
  88 +const ConsultationOrder: FC<IProps> = memo(() => {
  89 + const dispatch = useAppDispatch()
  90 +
  91 + useEffect(() => {
  92 + dispatch(fetchOrderDataAction())
  93 + }, [])
  94 +
  95 + const { banners } = useAppSelector(
  96 + (state) => ({
  97 + banners: state.order.bannersList
  98 + }),
  99 + shallowEqualApp
  100 + )
  101 +
  102 + useEffect(() => {
  103 + if (!banners.length) return
  104 + console.log(banners)
  105 + }, [banners])
  106 +
  107 + const [text, setText] = useState<string[]>([])
  108 +
  109 + const items: TabsProps['items'] = [
  110 + { key: '0', label: '全部', children: ShowOrderComHandler({ orderList: text }) },
  111 + { key: '1', label: '待处理', children: ShowOrderComHandler({ orderList: text }) },
  112 + { key: '2', label: '处理中', children: ShowOrderComHandler({ orderList: text }) },
  113 + { key: '3', label: '已处理', children: ShowOrderComHandler({ orderList: text }) }
  114 + ]
  115 +
  116 + const onChange = (key: string) => {
  117 + setText([key, '1', '2', '', '', '', ''])
  118 + }
  119 +
  120 + return (
  121 + <ConsultationOrderWrapper>
  122 + <div className="title">问诊订单</div>
  123 + <Tabs defaultActiveKey="0" items={items} onChange={onChange} />;
  124 + <div className="paginationBox flexD">
  125 + <Pagination defaultCurrent={1} total={50} />
  126 + </div>
  127 + </ConsultationOrderWrapper>
  128 + )
  129 +})
  130 +
  131 +export default ConsultationOrder
  1 +import styled from "styled-components"
  2 +
  3 +export const ConsultationOrderWrapper = styled.div`
  4 + box-sizing: border-box;
  5 + padding: 16px 24px;
  6 + width: 100%;
  7 + height: calc(100vh - 65px);
  8 + overflow: auto;
  9 + position: relative;
  10 + .title{
  11 + font-size: 18px;
  12 + font-weight: 700;
  13 + margin-bottom: 16px;
  14 + }
  15 + .paginationBox{
  16 + /* position: absolute;
  17 + bottom: 20px;
  18 + right: 20px; */
  19 + }
  20 +`
  21 +
  22 +export const ConsultationOrderItemWrapper = styled.div`
  23 + display: flex;
  24 + flex-wrap: wrap;
  25 + margin-right: -32px;
  26 +
  27 + .orderItem{
  28 + margin-bottom: 16px;
  29 + margin-right: 16px;
  30 +
  31 + box-sizing: border-box;
  32 + padding: 10px 12px;
  33 + border-radius: 20px;
  34 + background: #fff;
  35 + width: 48%;
  36 + .topinfo{
  37 + margin-bottom: 20px;
  38 + .username{
  39 + color: #323233;
  40 + font-size: 15px;
  41 + font-weight: 700;
  42 + margin: 0 10px;
  43 + }
  44 + .statetag{
  45 + box-sizing: border-box;
  46 + padding: 2px 6px;
  47 + border: 1px solid #05B8D2;
  48 + border-radius: 8px;
  49 + color: #05b8d2;
  50 + font-size: 11px;
  51 + font-weight: 700;
  52 + margin-right: 10px;
  53 + }
  54 + .time{
  55 + color: #999999;
  56 + font-size: 13px;
  57 + }
  58 + .stateText{
  59 + color: #05b8d2;
  60 + font-size: 14px;
  61 + font-weight: 700;
  62 + }
  63 + }
  64 + .contenttext{
  65 + color: #323233;
  66 + font-size: 14px;
  67 + font-weight: 700;
  68 + margin-bottom: 10px;
  69 + span{
  70 + color: #666666;
  71 + }
  72 + }
  73 + .moneytext{
  74 + color: #f33f2e;
  75 + font-size: 14px;
  76 + font-weight: 700;
  77 + }
  78 + }
  79 +`
1 -import hyRequest from '@/service'  
2 -import React, { memo, useEffect } from 'react'  
3 -import type { FC, ReactNode } from 'react'  
4 -  
5 -interface IProps {  
6 - children?: ReactNode  
7 -}  
8 -  
9 -const Recommend: FC<IProps> = memo(() => {  
10 - useEffect(() => {  
11 - hyRequest.get({ url: '/banner' }).then((res) => {  
12 - console.log(res, 'banner')  
13 - })  
14 - }, [])  
15 -  
16 - return <div>Recommend</div>  
17 -})  
18 -  
19 -export default Recommend  
  1 +import React, { memo } from 'react'
  2 +import type { FC, ReactNode } from 'react'
  3 +
  4 +interface IProps {
  5 + children?: ReactNode
  6 +}
  7 +
  8 +const xx: FC<IProps> = memo(() => {
  9 + return <div style={{ width: '100%' }}>暂不开放</div>
  10 +})
  11 +
  12 +export default xx