|
|
|
|
@ -1,21 +1,17 @@
|
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
|
import {Row, Col, Button, Tabs, Table} from 'antd';
|
|
|
|
|
import {
|
|
|
|
|
ContainerOutlined, CarryOutOutlined, BlockOutlined,
|
|
|
|
|
SmileOutlined, TagsOutlined, GlobalOutlined,
|
|
|
|
|
SearchOutlined,
|
|
|
|
|
} from '@ant-design/icons';
|
|
|
|
|
import {stores_Context} from '../config'
|
|
|
|
|
import {Line} from "@ant-design/charts";
|
|
|
|
|
import React, { Component } from "react";
|
|
|
|
|
import { Row, Col, Button, Tabs, Table, Divider } from "antd";
|
|
|
|
|
import { ContainerOutlined, CarryOutOutlined, BlockOutlined, SmileOutlined, TagsOutlined, GlobalOutlined, SearchOutlined, FullscreenOutlined, DingtalkOutlined } from "@ant-design/icons";
|
|
|
|
|
import { stores_Context } from "../config";
|
|
|
|
|
import { Line, Pie } from "@ant-design/charts";
|
|
|
|
|
import SiteSelect from "../charts/SiteSelect";
|
|
|
|
|
import {observer} from 'mobx-react';
|
|
|
|
|
import DatePickerCharts from '../charts/DatePickerCharts'
|
|
|
|
|
import { observer } from "mobx-react";
|
|
|
|
|
import DatePickerCharts from "../charts/DatePickerCharts";
|
|
|
|
|
import * as config from "../config";
|
|
|
|
|
import {NavLink} from "react-router-dom";
|
|
|
|
|
import * as comm from "../utils/commons"
|
|
|
|
|
import { NavLink } from "react-router-dom";
|
|
|
|
|
import * as comm from "../utils/commons";
|
|
|
|
|
import { utils, writeFileXLSX } from "xlsx";
|
|
|
|
|
|
|
|
|
|
class Orders extends Component {
|
|
|
|
|
|
|
|
|
|
static contextType = stores_Context;
|
|
|
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
|
@ -28,66 +24,88 @@ class Orders extends Component {
|
|
|
|
|
// orders_store.onChange_Tabs(orders_store.active_tab_key);
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
format_data(data) {
|
|
|
|
|
const {date_picker_store, orders_store} = this.context;
|
|
|
|
|
let result = {dataSource: [], columns: []}
|
|
|
|
|
const { date_picker_store, orders_store } = this.context;
|
|
|
|
|
let result = { dataSource: [], columns: [] };
|
|
|
|
|
if (!comm.empty(data)) {
|
|
|
|
|
let ordercountTotal1 = data.ordercountTotal1;
|
|
|
|
|
let ordercountTotal2 = data.ordercountTotal2;
|
|
|
|
|
if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) { //有比较的数据
|
|
|
|
|
if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) {
|
|
|
|
|
//有比较的数据
|
|
|
|
|
result.columns = [
|
|
|
|
|
{
|
|
|
|
|
title: '',
|
|
|
|
|
children: [{
|
|
|
|
|
title: <span><div>{date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}</div><div>{date_picker_store.start_date_cp.format(config.DATE_FORMAT)}~{date_picker_store.end_date_cp.format(config.DATE_FORMAT)}</div></span>,
|
|
|
|
|
dataIndex: 'OrderType',
|
|
|
|
|
render: (text, record) => <NavLink
|
|
|
|
|
to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>
|
|
|
|
|
}]
|
|
|
|
|
title: "",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: (
|
|
|
|
|
<span>
|
|
|
|
|
<div>
|
|
|
|
|
{date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
{date_picker_store.start_date_cp.format(config.DATE_FORMAT)}~{date_picker_store.end_date_cp.format(config.DATE_FORMAT)}
|
|
|
|
|
</div>
|
|
|
|
|
</span>
|
|
|
|
|
),
|
|
|
|
|
dataIndex: "OrderType",
|
|
|
|
|
render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '数量',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "数量",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.OrderCount_vs, ordercountTotal1.OrderCount_diff, ordercountTotal1.OrderCount, ordercountTotal2.OrderCount),
|
|
|
|
|
dataIndex: 'OrderCount'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "OrderCount",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交数',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "成交数",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.CJCount_vs, ordercountTotal1.CJCount_diff, ordercountTotal1.CJCount, ordercountTotal2.CJCount),
|
|
|
|
|
dataIndex: 'CJCount'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "CJCount",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交人数',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "成交人数",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.CJPersonNum_vs, ordercountTotal1.CJPersonNum_diff, ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum),
|
|
|
|
|
dataIndex: 'CJPersonNum'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "CJPersonNum",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交率',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "成交率",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.CJrate_vs, ordercountTotal1.CJrate_diff, ordercountTotal1.CJrate, ordercountTotal2.CJrate),
|
|
|
|
|
dataIndex: 'CJrate'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "CJrate",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交毛利（预计）',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "成交毛利（预计）",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.YJLY_vs, ordercountTotal1.YJLY_diff, ordercountTotal1.YJLY, ordercountTotal2.YJLY),
|
|
|
|
|
dataIndex: 'YJLY'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "YJLY",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
title: '单个订单价值',
|
|
|
|
|
children: [{
|
|
|
|
|
title: "单个订单价值",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: comm.show_vs_tag(ordercountTotal1.Ordervalue_vs, ordercountTotal1.Ordervalue_diff, ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue),
|
|
|
|
|
dataIndex: 'Ordervalue'
|
|
|
|
|
}],
|
|
|
|
|
dataIndex: "Ordervalue",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
for (let item of data.ordercount1) {
|
|
|
|
|
@ -103,52 +121,58 @@ class Orders extends Component {
|
|
|
|
|
CJrate: comm.show_vs_tag(item.CJrate_vs, item.CJrate_diff, item.CJrate, item2.CJrate),
|
|
|
|
|
YJLY: comm.show_vs_tag(item.YJLY_vs, item.YJLY_diff, item.YJLY, item2.YJLY),
|
|
|
|
|
Ordervalue: comm.show_vs_tag(item.Ordervalue_vs, item.Ordervalue_diff, item.Ordervalue, item2.Ordervalue),
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
result.columns =
|
|
|
|
|
[
|
|
|
|
|
result.columns = [
|
|
|
|
|
{
|
|
|
|
|
title: "",
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: '',
|
|
|
|
|
children: [{
|
|
|
|
|
title: <span><div>{date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}</div></span>,
|
|
|
|
|
dataIndex: 'OrderType',
|
|
|
|
|
render: (text, record) => <NavLink
|
|
|
|
|
to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>
|
|
|
|
|
}]
|
|
|
|
|
title: (
|
|
|
|
|
<span>
|
|
|
|
|
<div>
|
|
|
|
|
{date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}
|
|
|
|
|
</div>
|
|
|
|
|
</span>
|
|
|
|
|
),
|
|
|
|
|
dataIndex: "OrderType",
|
|
|
|
|
render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '数量',
|
|
|
|
|
children: [{title: ordercountTotal1.OrderCount, dataIndex: 'OrderCount'}],
|
|
|
|
|
title: "数量",
|
|
|
|
|
children: [{ title: ordercountTotal1.OrderCount, dataIndex: "OrderCount" }],
|
|
|
|
|
sorter: (a, b) => b.OrderCount - a.OrderCount,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交数',
|
|
|
|
|
children: [{title: ordercountTotal1.CJCount, dataIndex: 'CJCount'}],
|
|
|
|
|
title: "成交数",
|
|
|
|
|
children: [{ title: ordercountTotal1.CJCount, dataIndex: "CJCount" }],
|
|
|
|
|
sorter: (a, b) => b.CJCount - a.CJCount,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交人数',
|
|
|
|
|
children: [{title: ordercountTotal1.CJPersonNum, dataIndex: 'CJPersonNum'}],
|
|
|
|
|
title: "成交人数",
|
|
|
|
|
children: [{ title: ordercountTotal1.CJPersonNum, dataIndex: "CJPersonNum" }],
|
|
|
|
|
sorter: (a, b) => b.CJPersonNum - a.CJPersonNum,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交率',
|
|
|
|
|
children: [{title: ordercountTotal1.CJrate, dataIndex: 'CJrate'}],
|
|
|
|
|
title: "成交率",
|
|
|
|
|
children: [{ title: ordercountTotal1.CJrate, dataIndex: "CJrate" }],
|
|
|
|
|
sorter: (a, b) => parseInt(b.CJrate) - parseInt(a.CJrate),
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: '成交毛利（预计）',
|
|
|
|
|
children: [{title: ordercountTotal1.YJLY, dataIndex: 'YJLY'}],
|
|
|
|
|
sorter: (a, b) => b.YJLY - a.YJLY,
|
|
|
|
|
title: "成交毛利（预计）",
|
|
|
|
|
children: [{ title: ordercountTotal1.YJLY, dataIndex: "YJLY" }],
|
|
|
|
|
sorter: (a, b) => parseFloat(b.YJLY.replace(/,/g, "")) - parseFloat(a.YJLY.replace(/,/g, "")),
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
title: '单个订单价值',
|
|
|
|
|
children: [{title: ordercountTotal1.Ordervalue, dataIndex: 'Ordervalue'}],
|
|
|
|
|
sorter: (a, b) => b.Ordervalue - a.Ordervalue,
|
|
|
|
|
title: "单个订单价值",
|
|
|
|
|
children: [{ title: ordercountTotal1.Ordervalue, dataIndex: "Ordervalue" }],
|
|
|
|
|
sorter: (a, b) => parseFloat(b.Ordervalue.replace(/,/g, "")) - parseFloat(a.Ordervalue.replace(/,/g, "")),
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
result.dataSource = data.ordercount1;
|
|
|
|
|
@ -158,50 +182,53 @@ class Orders extends Component {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
const {orders_store} = this.context;
|
|
|
|
|
const { orders_store } = this.context;
|
|
|
|
|
const table_data = orders_store.orderCountData_Form ? this.format_data(orders_store.orderCountData_Form) : [];
|
|
|
|
|
const data_source = orders_store.orderCountData ? orders_store.orderCountData : [];
|
|
|
|
|
const avg_line_y=data_source.length ? Math.round((data_source.reduce((a, b) => a + b.yField, 0))/data_source.length):0;//平均值，显示一条平均线
|
|
|
|
|
const avg_line_y = data_source.length ? Math.round(data_source.reduce((a, b) => a + b.yField, 0) / data_source.length) : 0; //平均值，显示一条平均线
|
|
|
|
|
const pie_data = comm.empty(orders_store.orderCountData_Form) ? [] : orders_store.orderCountData_Form.ordercount1; //饼图的显示
|
|
|
|
|
const pie_data2 = comm.empty(orders_store.orderCountData_Form) ? [] : orders_store.orderCountData_Form.ordercount2;
|
|
|
|
|
|
|
|
|
|
const config = {
|
|
|
|
|
data: data_source,
|
|
|
|
|
padding: 'auto',
|
|
|
|
|
xField: 'xField',
|
|
|
|
|
yField: 'yField',
|
|
|
|
|
seriesField: 'seriesField',
|
|
|
|
|
padding: "auto",
|
|
|
|
|
xField: "xField",
|
|
|
|
|
yField: "yField",
|
|
|
|
|
seriesField: "seriesField",
|
|
|
|
|
xAxis: {
|
|
|
|
|
type: 'timeCat',
|
|
|
|
|
type: "timeCat",
|
|
|
|
|
},
|
|
|
|
|
point: {
|
|
|
|
|
size: 4,
|
|
|
|
|
shape: 'cicle',
|
|
|
|
|
shape: "cicle",
|
|
|
|
|
},
|
|
|
|
|
annotations: [
|
|
|
|
|
{
|
|
|
|
|
type: 'text',
|
|
|
|
|
position: ['start', avg_line_y],
|
|
|
|
|
type: "text",
|
|
|
|
|
position: ["start", avg_line_y],
|
|
|
|
|
content: avg_line_y,
|
|
|
|
|
offsetX: -15,
|
|
|
|
|
style: {
|
|
|
|
|
fill: '#F4664A',
|
|
|
|
|
textBaseline: 'bottom',
|
|
|
|
|
}
|
|
|
|
|
fill: "#F4664A",
|
|
|
|
|
textBaseline: "bottom",
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: 'line',
|
|
|
|
|
type: "line",
|
|
|
|
|
start: [-10, avg_line_y],
|
|
|
|
|
end: ['max', avg_line_y],
|
|
|
|
|
end: ["max", avg_line_y],
|
|
|
|
|
style: {
|
|
|
|
|
stroke: '#F4664A',
|
|
|
|
|
stroke: "#F4664A",
|
|
|
|
|
lineDash: [2, 2],
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
label: {},//显示标签
|
|
|
|
|
label: {}, //显示标签
|
|
|
|
|
legend: {
|
|
|
|
|
itemValue: {
|
|
|
|
|
formatter: (text, item) => {
|
|
|
|
|
const items = data_source.filter((d) => d.seriesField === item.value);//按站点筛选
|
|
|
|
|
return items.length ? items.reduce((a, b) => a + b.yField, 0) : '';//计算总数
|
|
|
|
|
const items = data_source.filter(d => d.seriesField === item.value); //按站点筛选
|
|
|
|
|
return items.length ? items.reduce((a, b) => a + b.yField, 0) : ""; //计算总数
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
@ -211,68 +238,284 @@ class Orders extends Component {
|
|
|
|
|
// return `<div>${title}</div><div>${data.seriesField} ${data.yField}</div>`;
|
|
|
|
|
// }
|
|
|
|
|
title: (title, datum) => {
|
|
|
|
|
return title+' '+ comm.getWeek(datum.xField);//显示周几
|
|
|
|
|
return title + " " + comm.getWeek(datum.xField); //显示周几
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
smooth: true,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const pie_config = {
|
|
|
|
|
appendPadding: 10,
|
|
|
|
|
data: [],
|
|
|
|
|
angleField: "OrderCount",
|
|
|
|
|
colorField: "OrderType",
|
|
|
|
|
radius: 0.8,
|
|
|
|
|
label: {
|
|
|
|
|
type: "outer",
|
|
|
|
|
content: "{name} {value} \n {percentage}",
|
|
|
|
|
},
|
|
|
|
|
legend: false, //不显示图例
|
|
|
|
|
interactions: [
|
|
|
|
|
{
|
|
|
|
|
type: "element-selected",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "element-active",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={14}>
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={14}></Col>
|
|
|
|
|
<Col span={2}>
|
|
|
|
|
<SiteSelect store={orders_store}/>
|
|
|
|
|
<SiteSelect store={orders_store} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={6}>
|
|
|
|
|
<DatePickerCharts/>
|
|
|
|
|
<DatePickerCharts />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={2}>
|
|
|
|
|
<Button type="primary" icon={<SearchOutlined/>} loading={orders_store.loading} onClick={() => {
|
|
|
|
|
<Button
|
|
|
|
|
type="primary"
|
|
|
|
|
icon={<SearchOutlined />}
|
|
|
|
|
loading={orders_store.loading}
|
|
|
|
|
onClick={() => {
|
|
|
|
|
orders_store.getOrderCount();
|
|
|
|
|
orders_store.onChange_Tabs(orders_store.active_tab_key);
|
|
|
|
|
}}>统计</Button>
|
|
|
|
|
}}>
|
|
|
|
|
统计
|
|
|
|
|
</Button>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
<Row gutter={[16, {xs: 8, sm: 16, md: 24, lg: 32}]}>
|
|
|
|
|
|
|
|
|
|
<Row gutter={[16, { xs: 8, sm: 16, md: 24, lg: 32 }]}>
|
|
|
|
|
<Col span={24}>
|
|
|
|
|
<Line {...config} />
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
|
|
<Col span={24}>
|
|
|
|
|
<Tabs activeKey={orders_store.active_tab_key}
|
|
|
|
|
onChange={(active_key) => orders_store.onChange_Tabs(active_key)}>
|
|
|
|
|
<Tabs.TabPane tab={<span><ContainerOutlined/>来源类型</span>} key="Form">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs activeKey={orders_store.active_tab_key} onChange={active_key => orders_store.onChange_Tabs(active_key)}>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<ContainerOutlined />
|
|
|
|
|
来源类型
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="Form">
|
|
|
|
|
<Table id="table_to_xlsx_form" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_form").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "来源类型.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane tab={<span><CarryOutOutlined/>产品类型</span>} key="Product">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<CarryOutOutlined />
|
|
|
|
|
产品类型
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="Product">
|
|
|
|
|
<Table id="table_to_xlsx_product" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_product").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "产品类型.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane tab={<span><SmileOutlined/>国籍</span>} key="Country">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<SmileOutlined />
|
|
|
|
|
国籍
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="Country">
|
|
|
|
|
<Table id="table_to_xlsx_country" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_country").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "国籍.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane tab={<span><TagsOutlined/>线路</span>} key="line">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<TagsOutlined />
|
|
|
|
|
线路
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="line">
|
|
|
|
|
<Table id="table_to_xlsx_line" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_line").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "线路.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane tab={<span><GlobalOutlined/>目的地</span>} key="city">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<GlobalOutlined />
|
|
|
|
|
目的地
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="city">
|
|
|
|
|
<Table id="table_to_xlsx_city" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_city").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "目的地.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<BlockOutlined />
|
|
|
|
|
页面类型
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="LineClass">
|
|
|
|
|
<Table id="table_to_xlsx_LineClass" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_LineClass").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "页面类型.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<FullscreenOutlined />
|
|
|
|
|
客群类别
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="GuestGroupType">
|
|
|
|
|
<Table id="table_to_xlsx_GuestGroupType" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_GuestGroupType").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "客群类别.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
<Tabs.TabPane tab={<span><BlockOutlined/>页面类型</span>} key="LineClass">
|
|
|
|
|
<Table dataSource={table_data.dataSource} columns={table_data.columns} size="small"/>
|
|
|
|
|
<Tabs.TabPane
|
|
|
|
|
tab={
|
|
|
|
|
<span>
|
|
|
|
|
<DingtalkOutlined />
|
|
|
|
|
出行动机
|
|
|
|
|
</span>
|
|
|
|
|
}
|
|
|
|
|
key="TravelMotivation">
|
|
|
|
|
<Table id="table_to_xlsx_TravelMotivation" dataSource={table_data.dataSource} columns={table_data.columns} size="small" pagination={false} />
|
|
|
|
|
<Divider orientation="right" plain>
|
|
|
|
|
<a
|
|
|
|
|
onClick={() => {
|
|
|
|
|
const wb = utils.table_to_book(document.getElementById("table_to_xlsx_TravelMotivation").getElementsByTagName("table")[0]);
|
|
|
|
|
writeFileXLSX(wb, "出行动机.xlsx");
|
|
|
|
|
}}>
|
|
|
|
|
导出excel
|
|
|
|
|
</a>
|
|
|
|
|
</Divider>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data} />
|
|
|
|
|
</Col>
|
|
|
|
|
<Col span={12}>
|
|
|
|
|
<Pie {...pie_config} data={pie_data2} />
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</Tabs.TabPane>
|
|
|
|
|
</Tabs>
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export
|
|
|
|
|
default
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
observer(Orders);
|
|
|
|
|
export default observer(Orders);
|
|
|
|
|
|
LiaoYijun
3 years ago