eslint autofix .
parent
0ec6966e75
commit
1ab0c7d0c7
@ -1,139 +1,203 @@
|
||||
import "./App.css";
|
||||
import React, { useContext } from "react";
|
||||
import { HomeOutlined, TeamOutlined, DashboardOutlined, FileProtectOutlined, CustomerServiceTwoTone, SnippetsTwoTone, DollarOutlined, AreaChartOutlined, WechatOutlined, UserOutlined } from "@ant-design/icons";
|
||||
import { Layout, Menu, Image, Spin } from "antd";
|
||||
import { BrowserRouter, Route, Routes, NavLink } from "react-router-dom";
|
||||
import Home from "./views/Home";
|
||||
import Dashboard from "./views/Dashboard";
|
||||
import Orders from "./views/Orders";
|
||||
import Orders_sub from "./views/Orders_sub";
|
||||
import ProtectedRoute from "./views/ProtectedRoute";
|
||||
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 Wechat_session from "./charts/Wechat_session";
|
||||
import WhatsApp_session from "./charts/WhatsApp_session";
|
||||
import AgentGroupCount from "./views/AgentGroupCount";
|
||||
import AgentGroupList from "./views/AgentGroupList";
|
||||
import DestinationGroupCount from "./views/DestinationGroupCount";
|
||||
import DestinationGroupList from "./views/DestinationGroupList";
|
||||
import Credit_card_bill from "./views/Credit_card_bill";
|
||||
import exchange_rate from "./charts/ExchangeRate";
|
||||
import Sale from "./views/Sale";
|
||||
import Sale_sub from "./views/Sale_sub";
|
||||
import Logo from "./logo.png";
|
||||
import { stores_Context } from "./config";
|
||||
import { observer } from "mobx-react";
|
||||
import ExchangeRate from "./charts/ExchangeRate";
|
||||
import './App.css';
|
||||
import React, { useContext } from 'react';
|
||||
import {
|
||||
HomeOutlined,
|
||||
TeamOutlined,
|
||||
DashboardOutlined,
|
||||
FileProtectOutlined,
|
||||
CustomerServiceTwoTone,
|
||||
SnippetsTwoTone,
|
||||
DollarOutlined,
|
||||
AreaChartOutlined,
|
||||
WechatOutlined,
|
||||
UserOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import { Layout, Menu, Image, Spin } from 'antd';
|
||||
import { BrowserRouter, Route, Routes, NavLink } from 'react-router-dom';
|
||||
import Home from './views/Home';
|
||||
import Dashboard from './views/Dashboard';
|
||||
import Orders from './views/Orders';
|
||||
import Orders_sub from './views/Orders_sub';
|
||||
import ProtectedRoute from './views/ProtectedRoute';
|
||||
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 Wechat_session from './charts/Wechat_session';
|
||||
import WhatsApp_session from './charts/WhatsApp_session';
|
||||
import AgentGroupCount from './views/AgentGroupCount';
|
||||
import AgentGroupList from './views/AgentGroupList';
|
||||
import DestinationGroupCount from './views/DestinationGroupCount';
|
||||
import DestinationGroupList from './views/DestinationGroupList';
|
||||
import Credit_card_bill from './views/Credit_card_bill';
|
||||
import Sale from './views/Sale';
|
||||
import Sale_sub from './views/Sale_sub';
|
||||
import Logo from './logo.png';
|
||||
import { stores_Context } from './config';
|
||||
import { observer } from 'mobx-react';
|
||||
import ExchangeRate from './charts/ExchangeRate';
|
||||
|
||||
const App = () => {
|
||||
const { Content, Footer, Sider } = Layout;
|
||||
const { auth_store } = useContext(stores_Context);
|
||||
const { Content, Footer, Sider } = Layout;
|
||||
const { auth_store } = useContext(stores_Context);
|
||||
|
||||
const menu_items = [
|
||||
{ key: 1, label: <NavLink to="/">主页</NavLink>, icon: <HomeOutlined /> },
|
||||
{
|
||||
key: 2,
|
||||
label: "市场",
|
||||
icon: <AreaChartOutlined />,
|
||||
children: [
|
||||
{ key: 21, label: <NavLink to="/orders">订单数据</NavLink>, icon: <FileProtectOutlined /> },
|
||||
{ key: 22, label: <NavLink to="/dashboard">仪表盘</NavLink>, icon: <DashboardOutlined /> },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
label: "销售",
|
||||
icon: <SnippetsTwoTone />,
|
||||
children: [{ key: 51, label: <NavLink to="/sale">业绩数据</NavLink> }],
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
label: "客运",
|
||||
icon: <WechatOutlined />,
|
||||
children: [
|
||||
{ key: 31, label: <NavLink to="/customer_care_potential">潜力客户</NavLink> },
|
||||
{ key: 32, label: <NavLink to="/customer_care_regular">老客户</NavLink> },
|
||||
{ key: 33, label: <NavLink to="/customer_care_inchina">在华客户</NavLink> },
|
||||
{ key: 34, label: <NavLink to="/wechat_session">微信会话存档</NavLink> },
|
||||
{ key: 35, label: <NavLink to="/whatsapp_session">WhatsApp会话存档</NavLink> },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
label: "财务",
|
||||
icon: <DollarOutlined />,
|
||||
children: [
|
||||
{ key: 41, label: <NavLink to="/credit_card_bill">信用卡账单</NavLink> },
|
||||
{ key: 42, label: <NavLink to="/exchange_rate">汇率</NavLink> },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
label: "客服",
|
||||
icon: <WechatOutlined />,
|
||||
children: [
|
||||
{ key: 61, label: <NavLink to="/agent/group/count">地接社接团</NavLink> },
|
||||
{ key: 62, label: <NavLink to="/destination/group/count">目的地接团</NavLink> },
|
||||
],
|
||||
}
|
||||
];
|
||||
const menu_items = [
|
||||
{ key: 1, label: <NavLink to="/">主页</NavLink>, icon: <HomeOutlined /> },
|
||||
{
|
||||
key: 2,
|
||||
label: '市场',
|
||||
icon: <AreaChartOutlined />,
|
||||
children: [
|
||||
{
|
||||
key: 21,
|
||||
label: <NavLink to="/orders">订单数据</NavLink>,
|
||||
icon: <FileProtectOutlined />,
|
||||
},
|
||||
{
|
||||
key: 22,
|
||||
label: <NavLink to="/dashboard">仪表盘</NavLink>,
|
||||
icon: <DashboardOutlined />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
label: '销售',
|
||||
icon: <SnippetsTwoTone />,
|
||||
children: [{ key: 51, label: <NavLink to="/sale">业绩数据</NavLink> }],
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
label: '客运',
|
||||
icon: <WechatOutlined />,
|
||||
children: [
|
||||
{
|
||||
key: 31,
|
||||
label: <NavLink to="/customer_care_potential">潜力客户</NavLink>,
|
||||
},
|
||||
{
|
||||
key: 32,
|
||||
label: <NavLink to="/customer_care_regular">老客户</NavLink>,
|
||||
},
|
||||
{
|
||||
key: 33,
|
||||
label: <NavLink to="/customer_care_inchina">在华客户</NavLink>,
|
||||
},
|
||||
{
|
||||
key: 34,
|
||||
label: <NavLink to="/wechat_session">微信会话存档</NavLink>,
|
||||
},
|
||||
{
|
||||
key: 35,
|
||||
label: <NavLink to="/whatsapp_session">WhatsApp会话存档</NavLink>,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
label: '财务',
|
||||
icon: <DollarOutlined />,
|
||||
children: [
|
||||
{
|
||||
key: 41,
|
||||
label: <NavLink to="/credit_card_bill">信用卡账单</NavLink>,
|
||||
},
|
||||
{ key: 42, label: <NavLink to="/exchange_rate">汇率</NavLink> },
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
label: '客服',
|
||||
icon: <WechatOutlined />,
|
||||
children: [
|
||||
{
|
||||
key: 61,
|
||||
label: <NavLink to="/agent/group/count">地接社接团</NavLink>,
|
||||
},
|
||||
{
|
||||
key: 62,
|
||||
label: <NavLink to="/destination/group/count">目的地接团</NavLink>,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<Layout
|
||||
style={{
|
||||
minHeight: "100vh",
|
||||
}}>
|
||||
<Sider collapsible={true} breakpoint="lg">
|
||||
<Image src={Logo} preview={false} />
|
||||
<Menu theme="dark" defaultSelectedKeys={["1"]} defaultOpenKeys={["2", "5"]} mode="inline" items={menu_items} />
|
||||
</Sider>
|
||||
<Layout className="site-layout">
|
||||
<Content
|
||||
style={{
|
||||
padding: 16,
|
||||
minHeight: 480,
|
||||
}}>
|
||||
<Routes>
|
||||
<Route path="/" element={<Home />} />
|
||||
<Route element={<ProtectedRoute auth={["admin", "director_bu", "marketing"]} />}>
|
||||
<Route path="/orders" element={<Orders />} />
|
||||
<Route path="/orders_sub/:ordertype/:ordertype_sub/:ordertype_title" element={<Orders_sub />} />
|
||||
<Route path="/dashboard" element={<Dashboard />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={["admin", "director_bu", "customer_care"]} />}>
|
||||
<Route path="/customer_care_inchina" element={<Customer_care_inchina />} />
|
||||
<Route path="/customer_care_regular" element={<Customer_care_regular />} />
|
||||
<Route path="/customer_care_potential" element={<Customer_care_potential />} />
|
||||
<Route path="/whatsapp_session" element={<WhatsApp_session />} />
|
||||
<Route path="/wechat_session" element={<Wechat_session />} />
|
||||
<Route path="/agent/group/count" element={<AgentGroupCount />} />
|
||||
<Route path="/destination/group/count" element={<DestinationGroupCount />} />
|
||||
<Route path="/agent/:agentId/group/list" element={<AgentGroupList />} />
|
||||
<Route path="/destination/:destinationId/group/list" element={<DestinationGroupList />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={["admin", "director_bu", "financial"]} />}>
|
||||
<Route path="/credit_card_bill" element={<Credit_card_bill />} />
|
||||
<Route path="/exchange_rate" element={<ExchangeRate />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={["admin", "director_bu", "sale"]} />}>
|
||||
<Route path="/sale" element={<Sale />} />
|
||||
<Route path="/sale_sub/:type_sub" element={<Sale_sub />} />
|
||||
</Route>
|
||||
</Routes>
|
||||
</Content>
|
||||
<Footer
|
||||
style={{
|
||||
textAlign: "center",
|
||||
}}>
|
||||
<UserOutlined /> {auth_store.user.name} ({auth_store.user.userid})<br />
|
||||
Hainatravel Dashboard ©2022 Created by IT
|
||||
</Footer>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</BrowserRouter>
|
||||
);
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<Layout
|
||||
hasSider
|
||||
style={{
|
||||
minHeight: '100vh',
|
||||
}}
|
||||
>
|
||||
<Sider
|
||||
collapsible={true}
|
||||
breakpoint="lg"
|
||||
style={{
|
||||
overflow: 'auto',
|
||||
height: '100vh',
|
||||
position: 'sticky',
|
||||
left: 0,
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
}}
|
||||
>
|
||||
<Image src={Logo} preview={false} />
|
||||
<Menu
|
||||
theme="dark"
|
||||
defaultSelectedKeys={['1']}
|
||||
defaultOpenKeys={['2', '5']}
|
||||
mode="inline"
|
||||
items={menu_items}
|
||||
/>
|
||||
</Sider>
|
||||
<Layout className="site-layout">
|
||||
<Content
|
||||
style={{
|
||||
padding: 16,
|
||||
minHeight: 480,
|
||||
}}
|
||||
>
|
||||
<Routes>
|
||||
<Route path="/" element={<Home />} />
|
||||
<Route element={<ProtectedRoute auth={['admin', 'director_bu', 'marketing']} />}>
|
||||
<Route path="/orders" element={<Orders />} />
|
||||
<Route path="/orders_sub/:ordertype/:ordertype_sub/:ordertype_title" element={<Orders_sub />} />
|
||||
<Route path="/dashboard" element={<Dashboard />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={['admin', 'director_bu', 'customer_care']} />}>
|
||||
<Route path="/customer_care_inchina" element={<Customer_care_inchina />} />
|
||||
<Route path="/customer_care_regular" element={<Customer_care_regular />} />
|
||||
<Route path="/customer_care_potential" element={<Customer_care_potential />} />
|
||||
<Route path="/whatsapp_session" element={<WhatsApp_session />} />
|
||||
<Route path="/wechat_session" element={<Wechat_session />} />
|
||||
<Route path="/agent/group/count" element={<AgentGroupCount />} />
|
||||
<Route path="/destination/group/count" element={<DestinationGroupCount />} />
|
||||
<Route path="/agent/:agentId/group/list" element={<AgentGroupList />} />
|
||||
<Route path="/destination/:destinationId/group/list" element={<DestinationGroupList />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={['admin', 'director_bu', 'financial']} />}>
|
||||
<Route path="/credit_card_bill" element={<Credit_card_bill />} />
|
||||
<Route path="/exchange_rate" element={<ExchangeRate />} />
|
||||
</Route>
|
||||
<Route element={<ProtectedRoute auth={['admin', 'director_bu', 'sale']} />}>
|
||||
<Route path="/sale" element={<Sale />} />
|
||||
<Route path="/sale_sub/:type_sub" element={<Sale_sub />} />
|
||||
</Route>
|
||||
</Routes>
|
||||
</Content>
|
||||
<Footer
|
||||
style={{
|
||||
textAlign: 'center',
|
||||
}}
|
||||
>
|
||||
<UserOutlined /> {auth_store.user.name} ({auth_store.user.userid})
|
||||
<br />
|
||||
Hainatravel Dashboard ©2022 Created by IT
|
||||
</Footer>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</BrowserRouter>
|
||||
);
|
||||
};
|
||||
|
||||
export default observer(App);
|
||||
|
@ -1,74 +1,83 @@
|
||||
import React, {Component} from 'react';
|
||||
import {Row, Col, Button, Tabs, Table, Space} from 'antd';
|
||||
import React, { Component } from 'react';
|
||||
import { Row, Col, Button, Tabs, Table, Space } from 'antd';
|
||||
import {
|
||||
ContainerOutlined, CarryOutOutlined,
|
||||
SmileOutlined, TagsOutlined, GlobalOutlined,
|
||||
SearchOutlined,
|
||||
ContainerOutlined,
|
||||
CarryOutOutlined,
|
||||
SmileOutlined,
|
||||
TagsOutlined,
|
||||
GlobalOutlined,
|
||||
SearchOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import {stores_Context} from '../config'
|
||||
import {Line} from "@ant-design/charts";
|
||||
import SiteSelect from "./SiteSelect";
|
||||
import {observer} from 'mobx-react';
|
||||
import DatePickerCharts from './DatePickerCharts'
|
||||
import { stores_Context } from '../config';
|
||||
import { Line } from '@ant-design/charts';
|
||||
import SiteSelect from './SiteSelect';
|
||||
import { observer } from 'mobx-react';
|
||||
import DatePickerCharts from './DatePickerCharts';
|
||||
|
||||
class Orders extends Component {
|
||||
static contextType = stores_Context;
|
||||
|
||||
static contextType = stores_Context;
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
// componentDidMount() {
|
||||
// const {orders_store} = this.context;
|
||||
// orders_store.getOrderCount();
|
||||
// orders_store.onChange_Tabs(orders_store.active_tab_key);
|
||||
// }
|
||||
|
||||
// componentDidMount() {
|
||||
// const {orders_store} = this.context;
|
||||
// orders_store.getOrderCount();
|
||||
// orders_store.onChange_Tabs(orders_store.active_tab_key);
|
||||
// }
|
||||
render() {
|
||||
const { dashboard_store } = this.context;
|
||||
const orders_data = dashboard_store.orders_data;
|
||||
const line_config = {
|
||||
data: orders_data.data,
|
||||
padding: 'auto',
|
||||
xField: 'ApplyDate',
|
||||
yField: 'orderCount',
|
||||
seriesField: 'WebCode',
|
||||
xAxis: {
|
||||
type: 'timeCat',
|
||||
},
|
||||
smooth: true,
|
||||
legend: {
|
||||
position: 'right-top',
|
||||
title: {
|
||||
text: '总合计 ' + orders_data.data.reduce((a, b) => a + b.orderCount, 0),
|
||||
},
|
||||
itemMarginBottom: 12, // 垂直间距
|
||||
itemValue: {
|
||||
formatter: (text, item) => {
|
||||
const items = orders_data.data.filter((d) => d.WebCode === item.value); // 按站点筛选
|
||||
return items.length ? items.reduce((a, b) => a + b.orderCount, 0) : ''; // 计算总数
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
render() {
|
||||
const {dashboard_store} = this.context;
|
||||
const orders_data = dashboard_store.orders_data;
|
||||
const line_config = {
|
||||
data: orders_data.data,
|
||||
padding: 'auto',
|
||||
xField: 'ApplyDate',
|
||||
yField: 'orderCount',
|
||||
seriesField: 'WebCode',
|
||||
xAxis: {
|
||||
type: 'timeCat',
|
||||
},
|
||||
smooth: true,
|
||||
legend: {
|
||||
position: 'right-top',
|
||||
title: {
|
||||
text: '总合计 ' + orders_data.data.reduce((a, b) => a + b.orderCount, 0),
|
||||
},
|
||||
itemMarginBottom: 12,//垂直间距
|
||||
itemValue: {
|
||||
formatter: (text, item) => {
|
||||
const items = orders_data.data.filter((d) => d.WebCode === item.value);//按站点筛选
|
||||
return items.length ? items.reduce((a, b) => a + b.orderCount, 0) : '';//计算总数
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h2>全网站订单数统计</h2>
|
||||
<div>
|
||||
<Space>
|
||||
<DatePickerCharts hide_vs={true}/>
|
||||
<Button type="primary" icon={<SearchOutlined/>} loading={orders_data.loading} onClick={() => {
|
||||
orders_data.getOrderCount_all();
|
||||
}}>统计</Button>
|
||||
</Space>
|
||||
</div>
|
||||
<br/>
|
||||
<Line {...line_config}/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<h2>全网站订单数统计</h2>
|
||||
<div>
|
||||
<Space>
|
||||
<DatePickerCharts hide_vs={true} />
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<SearchOutlined />}
|
||||
loading={orders_data.loading}
|
||||
onClick={() => {
|
||||
orders_data.getOrderCount_all();
|
||||
}}
|
||||
>
|
||||
统计
|
||||
</Button>
|
||||
</Space>
|
||||
</div>
|
||||
<br />
|
||||
<Line {...line_config} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default observer(Orders);
|
||||
|
Loading…
Reference in New Issue