diff --git a/src/App.js b/src/App.js index fb94e84..51bb257 100644 --- a/src/App.js +++ b/src/App.js @@ -5,6 +5,7 @@ import { TeamOutlined, DashboardOutlined, FileProtectOutlined, + CustomerServiceTwoTone, } from '@ant-design/icons'; import {Layout, Menu, Image} from 'antd'; import {BrowserRouter, Route, Routes, NavLink} from "react-router-dom" @@ -12,17 +13,14 @@ import Home from "./views/Home" import Dashboard from "./views/Dashboard" import Orders from "./views/Orders" import Orders_sub from "./views/Orders_sub" -import Orders_index from "./charts/Orders" +import Customer_care_inchina from "./charts/Customer_care_inchina" +import Customer_care_potential from "./charts/Customer_care_potential" +import Customer_care_regular from "./charts/Customer_care_regular" import Logo from './logo.png' class App extends Component { - constructor(props) { - super(props); - this.stores = this.props.stores; - } - render() { const {Content, Footer, Sider} = Layout; @@ -30,7 +28,14 @@ class App extends Component { const menu_items = [ {key: 1, label: 主页, icon: }, {key: 2, label: 订单数据, icon: ,}, - {key: 3, label: 仪表盘, icon: }, + { + key: 3, label: '客运', icon: , + children: [ + {key: 31, label: 潜力客户}, + {key: 32, label: 老客户}, + {key: 33, label: 在华客户}, + ] + }, { key: 4, label: '财务', @@ -40,6 +45,7 @@ class App extends Component { {key: 41, label: 信用卡账单}, ] }, + {key: 5, label: 仪表盘, icon: }, ]; @@ -53,7 +59,7 @@ class App extends Component { - + }/> }/> - }/> + }/> + }/> + }/> + }/> }/> diff --git a/src/charts/Customer_care_inchina.js b/src/charts/Customer_care_inchina.js new file mode 100644 index 0000000..c4da4d1 --- /dev/null +++ b/src/charts/Customer_care_inchina.js @@ -0,0 +1,191 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, Button, Divider, Table, Space, Radio} from 'antd'; +import { + ContainerOutlined, + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import {Line} from "@ant-design/charts"; +import {observer} from 'mobx-react'; +import DatePickerCharts from '../charts/DatePickerCharts' +import {NavLink, useParams} from "react-router-dom"; +import * as comm from "../utils/commons"; +import * as config from "../config"; +import SiteSelect from "../charts/SiteSelect"; +import GroupSelect from "../charts/GroupSelect"; + +const Customer_care_inchina = () => { + + const {orders_store, date_picker_store, customer_store} = useContext(stores_Context); + const inchina_data = customer_store.inchina_data; + + useEffect(() => { + + }, []) + + + return ( +
+ + +

在华客人

+ + + + + + + + + + + + + + 预定日期 + 出发日期 + + + + + + + + + + {text * 100}% + }, + { + title: '毛利', + dataIndex: 'ML', + key: 'ML', + }, + { + title: '人数(含成人+儿童)', + dataIndex: 'PersonNum', + key: 'PersonNum', + }, + ] + } size="small" pagination={false} rowKey={record => record.OrderNum} + /> + + + inchina_data.onChange_show_detail_table()}>{inchina_data.show_detail_table ? '隐藏列表' : '显示列表'} | + 导出excel + {inchina_data.show_detail_table ? +
record.COLI_ID} + /> + : ''} + + + + ); + +} +export default observer(Customer_care_inchina); + diff --git a/src/charts/Customer_care_potential.js b/src/charts/Customer_care_potential.js new file mode 100644 index 0000000..df88788 --- /dev/null +++ b/src/charts/Customer_care_potential.js @@ -0,0 +1,187 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, Button, Divider, Table, Space, Radio} from 'antd'; +import { + ContainerOutlined, + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import {Line} from "@ant-design/charts"; +import {observer} from 'mobx-react'; +import DatePickerCharts from '../charts/DatePickerCharts' +import {NavLink, useParams} from "react-router-dom"; +import * as comm from "../utils/commons"; +import * as config from "../config"; +import SiteSelect from "../charts/SiteSelect"; +import GroupSelect from "../charts/GroupSelect"; + +const Customer_care_potential = () => { + + const {orders_store, date_picker_store, customer_store} = useContext(stores_Context); + const potential_data = customer_store.potential_data; + + useEffect(() => { + + }, []) + + + return ( +
+ +
+

潜力客户

+ + + + + + + + + + + + + + 预定日期 + 出发日期 + + + + + + + + + +
{text * 100}% + }, + { + title: '毛利', + dataIndex: 'ML', + key: 'ML', + }, + { + title: '人数(含成人+儿童)', + dataIndex: 'PersonNum', + key: 'PersonNum', + }, + ] + } size="small" pagination={false} rowKey={record => record.OrderNum} + /> + + + potential_data.onChange_show_detail_table()}>{potential_data.show_detail_table ? '隐藏列表' : '显示列表'} | + 导出excel + {potential_data.show_detail_table ? +
record.COLI_ID} + /> + : ''} + + + + + ); + +} +export default observer(Customer_care_potential); + diff --git a/src/charts/Customer_care_regular.js b/src/charts/Customer_care_regular.js new file mode 100644 index 0000000..3607eff --- /dev/null +++ b/src/charts/Customer_care_regular.js @@ -0,0 +1,192 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, Button, Divider, Table, Space, Radio} from 'antd'; +import { + ContainerOutlined, + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import {Line} from "@ant-design/charts"; +import {observer} from 'mobx-react'; +import DatePickerCharts from '../charts/DatePickerCharts' +import {NavLink, useParams} from "react-router-dom"; +import * as comm from "../utils/commons"; +import * as config from "../config"; +import SiteSelect from "../charts/SiteSelect"; +import GroupSelect from "../charts/GroupSelect"; + +const Customer_care_regular = () => { + + const {orders_store, date_picker_store, customer_store} = useContext(stores_Context); + const regular_data = customer_store.regular_data; + + useEffect(() => { + + }, []) + + + return ( +
+ +
+

老客户

+ + + + + + + + + + + + + + 预定日期 + 出发日期 + + + + + + + + + +
{text * 100}% + }, + { + title: '毛利', + dataIndex: 'ML', + key: 'ML', + }, + { + title: '人数(含成人+儿童)', + dataIndex: 'PersonNum', + key: 'PersonNum', + }, + ] + } size="small" pagination={false} rowKey={record => record.OrderNum} + /> + + + regular_data.onChange_show_detail_table()}>{regular_data.show_detail_table ? '隐藏列表' : '显示列表'} | + 导出excel + {regular_data.show_detail_table ? +
record.COLI_ID} + /> + : ''} + + + + + ); + +} +export default observer(Customer_care_regular); + diff --git a/src/charts/SiteSelect.js b/src/charts/SiteSelect.js index 2ec2eeb..5fe00fa 100644 --- a/src/charts/SiteSelect.js +++ b/src/charts/SiteSelect.js @@ -1,6 +1,6 @@ import React, {Component} from 'react'; import {Select} from 'antd'; -import { observer } from 'mobx-react'; +import {observer} from 'mobx-react'; class SiteSelect extends Component { @@ -10,7 +10,7 @@ class SiteSelect extends Component { render() { - const store=this.props.store; + const store = this.props.store; return (