diff --git a/public/index.html b/public/index.html index 2b0b7a3..637312a 100644 --- a/public/index.html +++ b/public/index.html @@ -24,9 +24,7 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - React App - - + Hainatravel Dashboard diff --git a/src/config.js b/src/config.js index 5d3c28c..a07dcf8 100644 --- a/src/config.js +++ b/src/config.js @@ -2,5 +2,5 @@ import React from "react"; export const stores_Context = React.createContext(); export const DATE_FORMAT = 'YYYY-MM-DD'; -//export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; -export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file +export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; +//export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file diff --git a/src/stores/AuthStore.js b/src/stores/AuthStore.js index 9c093ad..d5f70ce 100644 --- a/src/stores/AuthStore.js +++ b/src/stores/AuthStore.js @@ -9,11 +9,11 @@ class AuthStore { constructor(rootStore) { this.rootStore = rootStore; makeAutoObservable(this); - //this.get_auth(); + //this.get_auth(); //放到钉钉环境才能开启 } - auth = ['admin']; - user = {name:'ycc',userid:'12345678'}; + auth = ['admin']; //开发时候用，正式环境留空 + user = {name:'ycc',userid:'12345678'};//开发时候用，正式环境留空 has_permission(requireds) { if (Object.keys(requireds).length == 0) { diff --git a/src/stores/FinancialStore.js b/src/stores/FinancialStore.js index 1d6f320..245ff2d 100644 --- a/src/stores/FinancialStore.js +++ b/src/stores/FinancialStore.js @@ -1,6 +1,7 @@ import {makeAutoObservable, runInAction} from "mobx"; import * as dd from 'dingtalk-jsapi'; import * as config from "../config"; +import * as comm from '../utils/commons' //财务管理 @@ -38,15 +39,42 @@ class FinancialStore { }); } + set_bill_filtered(values) { + if (Array.isArray(values)) { + this.credit_card_data.filteredValue = values; + } else if (comm.empty(values)) { + this.credit_card_data.filteredValue = []; + } else { + this.credit_card_data.filteredValue = [values]; + } + } + + set_active_tab(value) { + this.credit_card_data.active_tab = value; + } + + set_table_handleChange = (pagination, filters, sorter) => { + let filters_arr = Object.values(filters); + if (!comm.empty(filters_arr)) { + this.set_bill_filtered(filters_arr[0]); + } + }; + credit_card_data = { data: [], - loading:false, + data_by_type: [], + active_tab: 'summarized_data', + loading: false, bu_select_mode: false, business_units: ['ALL'], group_select_mode: false, groups: ['ALL'], + filteredValue: [],//默认的筛选值 bu_handleChange: this.bu_handleChange.bind(this), group_handleChange: this.group_handleChange.bind(this), + set_bill_filtered: this.set_bill_filtered.bind(this), + set_active_tab: this.set_active_tab.bind(this), + set_table_handleChange: this.set_table_handleChange.bind(this), }; bu_handleChange(value) { @@ -77,6 +105,27 @@ class FinancialStore { console.log('fetch data failed', error); }); } + + //请求信用卡账单 + get_credit_card_bills_by_type() { + const date_picker_store = this.rootStore.date_picker_store; + let url = '/service-web/QueryData/GetCreditCardBillsByType'; + url += `?business_unit=${this.credit_card_data.business_units.toString()}&groups=${this.credit_card_data.groups.toString()}`; + url += '&billdate1=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&billdate2=' + date_picker_store.end_date.format(config.DATE_FORMAT) + '%2023:59:59'; + if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) { + url += '&billdateOld1=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&billdateOld2=' + date_picker_store.end_date_cp.format(config.DATE_FORMAT) + '%2023:59:59'; + } + fetch(config.HT_HOST + url) + .then((response) => response.json()) + .then((json) => { + runInAction(() => { + this.credit_card_data.data_by_type = json; + }) + }) + .catch((error) => { + console.log('fetch data failed', error); + }); + } } diff --git a/src/stores/OrdersStore.js b/src/stores/OrdersStore.js index 3467dc3..f2ec8f4 100644 --- a/src/stores/OrdersStore.js +++ b/src/stores/OrdersStore.js @@ -8,7 +8,6 @@ import * as config from "../config"; import moment from "moment"; import {NavLink} from "react-router-dom"; - class OrdersStore { constructor(rootStore) { @@ -50,7 +49,10 @@ class OrdersStore { }) } if (data_source.ordercount2 && end_date) { - let diff_days = start_date.diff(end_date, 'days'); + //不能直接用diff计算，因为日期是含有时间的，会导致计算差一天，先转成格式化的日期再比较 + let _start_date=moment(start_date.format(config.DATE_FORMAT)); + let _end_date=moment(end_date.format(config.DATE_FORMAT)); + let diff_days = _start_date.diff(_end_date, 'days'); for (let item of data_source.ordercount2) { result.push({ 'xField': moment(item.ApplyDate).add(diff_days, 'days').format(config.DATE_FORMAT), @@ -109,16 +111,6 @@ class OrdersStore { }); } - show_vs_tag(vs, data1, data2) { - let tag = '-'; - if (parseInt(vs) < 0) { - tag = } color="gold">{vs} - } else if (parseInt(vs) > 0) { - tag = } color="lime">{vs} - } - return
{data1} vs {data2}
- {tag} - } //网站订单类型 getOrderCountByType(order_type) { diff --git a/src/utils/commons.js b/src/utils/commons.js index b9b9c59..f501970 100644 --- a/src/utils/commons.js +++ b/src/utils/commons.js @@ -1,18 +1,24 @@ // https://github.com/uxitten/polyfill/blob/master/string.polyfill.js // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart +import {Tag} from "antd"; +import { + CaretUpOutlined, + CaretDownOutlined +} from '@ant-design/icons'; +import moment from "moment"; + if (!String.prototype.padStart) { - String.prototype.padStart = function padStart(targetLength,padString) { - targetLength = targetLength>>0; //floor if number or convert non-number to 0; + String.prototype.padStart = function padStart(targetLength, padString) { + targetLength = targetLength >> 0; //floor if number or convert non-number to 0; padString = String((typeof padString !== 'undefined' ? padString : ' ')); if (this.length > targetLength) { return String(this); - } - else { - targetLength = targetLength-this.length; + } else { + targetLength = targetLength - this.length; if (targetLength > padString.length) { - padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed + padString += padString.repeat(targetLength / padString.length); //append to original to ensure we are longer than needed } - return padString.slice(0,targetLength) + String(this); + return padString.slice(0, targetLength) + String(this); } }; } @@ -28,21 +34,21 @@ export function named(value) { } export function formatCurrency(name) { - if (name === 'USD' ) { - return '$'; - } else if (name === 'RMB') { - return '￥'; - } else if (name === 'EUR') { - return '€' - } else if (name === 'GBP') { - return '£' - } else { - return name + ' '; - } + if (name === 'USD') { + return '$'; + } else if (name === 'RMB') { + return '￥'; + } else if (name === 'EUR') { + return '€' + } else if (name === 'GBP') { + return '£' + } else { + return name + ' '; + } } export function formatPrice(price) { - return Math.ceil(price).toLocaleString(); + return Math.ceil(price).toLocaleString(); } export function formatPercent(number) { @@ -50,7 +56,9 @@ export function formatPercent(number) { } export function formatDate(date) { - if (isEmpty(date)) { return 'NaN'; } + if (isEmpty(date)) { + return 'NaN'; + } const year = date.getFullYear(); const month = date.getMonth() + 1; @@ -60,7 +68,7 @@ export function formatDate(date) { const dayStr = ('' + day).padStart(2, 0); const formatted = year + '-' + monthStr + '-' + dayStr; - return formatted; + return formatted; } export function formatTime(date) { @@ -170,8 +178,8 @@ export function debounce(fn, delay = 500) { export function throttle(fn, delay, atleast) { let timeout = null, - startTime = new Date(); - return function() { + startTime = new Date(); + return function () { let curTime = new Date(); clearTimeout(timeout); if (curTime - startTime >= atleast) { @@ -188,4 +196,44 @@ export function clickUrl(url) { httpLink.href = url; httpLink.target = '_blank'; httpLink.click(); -} \ No newline at end of file +} + +export function show_vs_tag(vs, vs_diff, data1, data2) { + let tag = '-'; + if (parseInt(vs) < 0) { + tag = } color="gold">{vs} {vs_diff} + } else if (parseInt(vs) > 0) { + tag = } color="lime">{vs} {vs_diff} + }// else { + // tag = } color="lime">{vs} {vs_diff} + // } + return
{data1} vs {data2}
+ {tag} +} + +//数组去掉重复 +export function unique(arr) { + let x = new Set(arr); + return [...x]; +} + +export function getWeek (date) { // 参数时间戳 + let week = moment(date).day(); + switch (week) { + case 1: + return '周一' + case 2: + return '周二' + case 3: + return '周三' + case 4: + return '周四' + case 5: + return '周五' + case 6: + return '周六' + case 0: + return '周日' + } +} + diff --git a/src/views/Credit_card_bill.js b/src/views/Credit_card_bill.js index 7ce23d6..1b95e4d 100644 --- a/src/views/Credit_card_bill.js +++ b/src/views/Credit_card_bill.js @@ -1,12 +1,13 @@ import React, {Component, useContext} from 'react'; import {observer} from 'mobx-react'; -import {Row, Col, Button, Tabs, Table} from 'antd'; +import {Row, Col, Button, Tabs, Table, Divider} from 'antd'; import {stores_Context} from '../config' -import {useNavigate} from "react-router-dom"; +import {utils, writeFileXLSX} from "xlsx"; +import {NavLink, useNavigate} from "react-router-dom"; import { SlackOutlined, - SketchOutlined, - AntCloudOutlined, + ContainerOutlined, + CarryOutOutlined, SearchOutlined, GithubOutlined } from '@ant-design/icons'; @@ -15,15 +16,190 @@ import GroupSelect from '../charts/GroupSelect' import Business_unit from '../charts/Business_unit' import DatePickerCharts from '../charts/DatePickerCharts' import {Line} from "@ant-design/charts"; -import * as com from '../utils/commons' +import * as comm from '../utils/commons' +import * as config from "../config"; + const Credit_card_bill = () => { - const {financial_store} = useContext(stores_Context); + const {financial_store, date_picker_store} = useContext(stores_Context); const {bill_type_data, credit_card_data} = financial_store; - const data_source = !com.empty(credit_card_data.data) ? credit_card_data.data.billdate1 : []; + + const format_data = ((data) => { + let result = {dataSource: [], columns: []} + if (!comm.empty(data)) { + if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) { //有比较的数据 + let total_data1 = data.BillTypeDataTotal1; + let total_data2 = data.BillTypeDataTotal2; + result.columns = [ + { + title: '项目类型', + children: [{ + title: '', + dataIndex: 'cb_billtype', + render: (text, record) => { + credit_card_data.set_bill_filtered(text);//切换到明细页 + credit_card_data.set_active_tab('detail_data'); + }}>{text} + }], + sorter: (a, b) => a.cb_billtype.localeCompare(b.cb_billtype), + }, + { + title: '美金', + children: [{ + title: comm.show_vs_tag(total_data1.usd_vs, total_data1.usd_diff, total_data1.cb_usd, total_data2.cb_usd), + dataIndex: 'cb_usd' + }], + }, + { + title: '人民币', + children: [{ + title: comm.show_vs_tag(total_data1.rmb_vs, total_data1.rmb_diff, total_data1.cb_rmb, total_data2.cb_rmb), + dataIndex: 'cb_rmb' + }], + }, + ]; + for (let item of data.BillTypeData1) { + for (let item2 of data.BillTypeData2) { + if (item.cb_billtype == item2.cb_billtype) { + result.dataSource.push({ + key: item.key, + cb_billtype: item.cb_billtype, + groups: item.groups, + cb_usd: comm.show_vs_tag(item.usd_vs, item.usd_diff, item.cb_usd, item2.cb_usd), + cb_rmb: comm.show_vs_tag(item.rmb_vs, item.rmb_diff, item.cb_rmb, item2.cb_rmb), + }) + } + } + } + } else { + result.columns = [ + { + title: '项目类型', + children: [{ + title: '', + dataIndex: 'cb_billtype', + render: (text, record) => { + credit_card_data.set_bill_filtered(text);//切换到明细页 + credit_card_data.set_active_tab('detail_data'); + }}>{text} + }], + sorter: (a, b) => a.cb_billtype.localeCompare(b.cb_billtype), + }, + { + title: '美金', + children: [{title: data.BillTypeDataTotal1.cb_usd, dataIndex: 'cb_usd'}], + sorter: (a, b) => parseFloat(b.cb_usd.replace(/,/g, '')) - parseFloat(a.cb_usd.replace(/,/g, '')), + }, + { + title: '人民币', + children: [{title: data.BillTypeDataTotal1.cb_rmb, dataIndex: 'cb_rmb'}], + sorter: (a, b) => parseFloat(b.cb_rmb.replace(/,/g, '')) - parseFloat(a.cb_rmb.replace(/,/g, '')), + }, + ] + result.dataSource = data.BillTypeData1; + } + } + return result; + }) + + const filters_array = (data_array) => { + return comm.unique(data_array).map(item => { + return {text: item, value: item} + }); + } + + const format_data_detail = ((data) => { + let result = {dataSource: [], columns: []} + if (!comm.empty(data)) { + let show_vs = false; + let usd_totle1, usd_totle2, usd_diff, usd_vs, rmb_totle1, rmb_totle2, rmb_diff, rmb_vs = 0; + usd_totle1 = Math.round(data.billdate1.reduce((a, b) => a + b.cb_usd, 0)); + rmb_totle1 = Math.round(data.billdate1.reduce((a, b) => a + b.cb_rmb, 0)); + if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) { //有比较的数据 + show_vs = true; + //计算汇总的变化 + usd_totle2 = Math.round(data.billdate2.reduce((a, b) => a + b.cb_usd, 0)); + usd_diff = usd_totle1 - usd_totle2; + usd_vs = comm.formatPercent(usd_diff / usd_totle1); + rmb_totle2 = Math.round(data.billdate2.reduce((a, b) => a + b.cb_rmb, 0)); + rmb_diff = rmb_totle1 - rmb_totle2; + rmb_vs = comm.formatPercent(rmb_diff / rmb_totle1); + } + if (show_vs) { //有比较的数据 + result.dataSource.push(...data.billdate1, ...data.billdate2); + } else { + result.dataSource.push(...data.billdate1); + } + result.columns = [ + { + title: '项目类型', + children: [{ + title: '', + dataIndex: 'cb_billtype', + }], + sorter: (a, b) => a.cb_billtype.localeCompare(b.cb_billtype), + filters: filters_array(result.dataSource.map((item) => { + return item.cb_billtype + })), + filteredValue: credit_card_data.filteredValue || null, + onFilter: (value, record) => record.cb_billtype.indexOf(value) === 0, + }, + { + title: '项目', + children: [{ + title: '', + dataIndex: 'cb_bill', + }], + sorter: (a, b) => a.cb_bill.localeCompare(b.cb_bill), + }, + { + title: '美金', + children: [{ + title: show_vs ? comm.show_vs_tag(usd_vs, usd_diff, usd_totle1, usd_totle2) : usd_totle1, + dataIndex: 'cb_usd' + }], + sorter: (a, b) => b.cb_usd - a.cb_usd, + }, + { + title: '人民币', + children: [{ + title: show_vs ? comm.show_vs_tag(rmb_vs, rmb_diff, rmb_totle1, rmb_totle2) : rmb_totle1, + dataIndex: 'cb_rmb' + }], + sorter: (a, b) => b.cb_rmb - a.cb_rmb, + }, + + { + title: '交易日期', + children: [{title: '', dataIndex: 'cb_datetime'}], + }, + { + title: '账期', + children: [{title: '', dataIndex: 'cb_billdate'}], + }, + { + title: '事业部', + children: [{title: '', dataIndex: 'cb_business_unit'}], + sorter: (a, b) => a.cb_business_unit.localeCompare(b.cb_business_unit), + }, + { + title: '小组', + children: [{title: '', dataIndex: 'cb_group'}], + sorter: (a, b) => a.cb_group.localeCompare(b.cb_group), + }, + ] + + } + + return result; + }) + + const credit_card_bills = !comm.empty(credit_card_data.data) ? format_data_detail(credit_card_data.data) : format_data_detail([]); + const credit_card_bills_by_type = !comm.empty(credit_card_data.data_by_type) ? format_data(credit_card_data.data_by_type) : format_data([]); + const line_config = { - data: data_source, + data: credit_card_bills.dataSource, padding: 'auto', xField: 'cb_datetime', yField: 'cb_usd', @@ -39,7 +215,7 @@ const Credit_card_bill = () => { legend: { itemValue: { formatter: (text, item) => { - const items = data_source.filter((d) => d.groups === item.value);//按站点筛选 + const items = credit_card_bills.dataSource.filter((d) => d.groups === item.value);//按站点筛选 return items.length ? Math.round(items.reduce((a, b) => a + b.cb_usd, 0)) : '';//计算总数 }, }, @@ -61,10 +237,10 @@ const Credit_card_bill = () => { - + - + {/**/} @@ -76,6 +252,8 @@ const Credit_card_bill = () => { @@ -84,6 +262,33 @@ const Credit_card_bill = () => { + + + 项目汇总} key="summarized_data"> + + { + const wb = utils.table_to_book(document.getElementById("table_by_type").getElementsByTagName('table')[0]); + writeFileXLSX(wb, "项目汇总.xlsx"); + }}>导出excel + + 明细} key="detail_data"> +
+ { + const wb = utils.table_to_book(document.getElementById("table_by_detail").getElementsByTagName('table')[0]); + writeFileXLSX(wb, "明细.xlsx"); + }}>导出excel + + + ); diff --git a/src/views/Orders.js b/src/views/Orders.js index 9bb1946..51ca871 100644 --- a/src/views/Orders.js +++ b/src/views/Orders.js @@ -1,7 +1,7 @@ import React, {Component} from 'react'; import {Row, Col, Button, Tabs, Table} from 'antd'; import { - ContainerOutlined, CarryOutOutlined,BlockOutlined, + ContainerOutlined, CarryOutOutlined, BlockOutlined, SmileOutlined, TagsOutlined, GlobalOutlined, SearchOutlined, } from '@ant-design/icons'; @@ -49,35 +49,35 @@ class Orders extends Component { { title: '数量', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.OrderCount_vs, ordercountTotal1.OrderCount, ordercountTotal2.OrderCount), + title: comm.show_vs_tag(ordercountTotal1.OrderCount_vs, ordercountTotal1.OrderCount_diff, ordercountTotal1.OrderCount, ordercountTotal2.OrderCount), dataIndex: 'OrderCount' }], }, { title: '成交数', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.CJCount_vs, ordercountTotal1.CJCount, ordercountTotal2.CJCount), + title: comm.show_vs_tag(ordercountTotal1.CJCount_vs, ordercountTotal1.CJCount_diff, ordercountTotal1.CJCount, ordercountTotal2.CJCount), dataIndex: 'CJCount' }], }, { title: '成交人数', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.CJPersonNum_vs, ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum), + title: comm.show_vs_tag(ordercountTotal1.CJPersonNum_vs, ordercountTotal1.CJPersonNum_diff, ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum), dataIndex: 'CJPersonNum' }], }, { title: '成交率', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.CJrate_vs, ordercountTotal1.CJrate, ordercountTotal2.CJrate), + title: comm.show_vs_tag(ordercountTotal1.CJrate_vs, ordercountTotal1.CJrate_diff, ordercountTotal1.CJrate, ordercountTotal2.CJrate), dataIndex: 'CJrate' }], }, { title: '成交毛利（预计）', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.YJLY_vs, ordercountTotal1.YJLY, ordercountTotal2.YJLY), + title: comm.show_vs_tag(ordercountTotal1.YJLY_vs, ordercountTotal1.YJLY_diff, ordercountTotal1.YJLY, ordercountTotal2.YJLY), dataIndex: 'YJLY' }], }, @@ -85,7 +85,7 @@ class Orders extends Component { { title: '单个订单价值', children: [{ - title: orders_store.show_vs_tag(ordercountTotal1.Ordervalue_vs, ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue), + title: comm.show_vs_tag(ordercountTotal1.Ordervalue_vs, ordercountTotal1.Ordervalue_diff, ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue), dataIndex: 'Ordervalue' }], }, @@ -94,15 +94,15 @@ class Orders extends Component { for (let item2 of data.ordercount2) { if (item.OrderType == item2.OrderType) { result.dataSource.push({ - key:item.key, + key: item.key, OrderType: item.OrderType, OrderTypeSN: item.OrderTypeSN, - OrderCount: orders_store.show_vs_tag(item.OrderCount_vs, item.OrderCount, item2.OrderCount), - CJCount: orders_store.show_vs_tag(item.CJCount_vs, item.CJCount, item2.CJCount), - CJPersonNum: orders_store.show_vs_tag(item.CJPersonNum_vs, item.CJPersonNum, item2.CJPersonNum), - CJrate: orders_store.show_vs_tag(item.CJrate_vs, item.CJrate, item2.CJrate), - YJLY: orders_store.show_vs_tag(item.YJLY_vs, item.YJLY, item2.YJLY), - Ordervalue: orders_store.show_vs_tag(item.Ordervalue_vs, item.Ordervalue, item2.Ordervalue), + OrderCount: comm.show_vs_tag(item.OrderCount_vs, item.OrderCount_diff, item.OrderCount, item2.OrderCount), + CJCount: comm.show_vs_tag(item.CJCount_vs, item.CJCount_diff, item.CJCount, item2.CJCount), + CJPersonNum: comm.show_vs_tag(item.CJPersonNum_vs, item.CJPersonNum_diff, item.CJPersonNum, item2.CJPersonNum), + 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), }) } } @@ -160,8 +160,8 @@ class Orders extends Component { render() { 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 config = { data: data_source, padding: 'auto', @@ -175,6 +175,27 @@ class Orders extends Component { size: 4, shape: 'cicle', }, + annotations: [ + { + type: 'text', + position: ['start', avg_line_y], + content: avg_line_y, + offsetX: -15, + style: { + fill: '#F4664A', + textBaseline: 'bottom', + } + }, + { + type: 'line', + start: [-10, avg_line_y], + end: ['max', avg_line_y], + style: { + stroke: '#F4664A', + lineDash: [2, 2], + }, + }, + ], label: {},//显示标签 legend: { itemValue: { @@ -184,12 +205,15 @@ class Orders extends Component { }, }, }, - // tooltip: { - // customContent: (title, items) => { - // const data = items[0]?.data || {}; - // return `
${title}
${data.seriesField} ${data.yField}
`; - // } - // }, + tooltip: { + // customContent: (title, items) => { + // const data = items[0]?.data || {}; + // return `
${title}
${data.seriesField} ${data.yField}
`; + // } + title: (title, datum) => { + return title+' '+ comm.getWeek(datum.xField);//显示周几 + }, + }, smooth: true, }; @@ -218,7 +242,7 @@ class Orders extends Component { - + orders_store.onChange_Tabs(active_key)}> 来源类型} key="Form"> @@ -236,7 +260,7 @@ class Orders extends Component { 目的地} key="city">
- 页面类型} key="LineClass"> + 页面类型} key="LineClass">
@@ -246,6 +270,9 @@ class Orders extends Component { ); } -} + } + + export + default -export default observer(Orders); + observer(Orders); diff --git a/src/views/Orders_sub.js b/src/views/Orders_sub.js index 9d3a8a3..eff9a00 100644 --- a/src/views/Orders_sub.js +++ b/src/views/Orders_sub.js @@ -24,6 +24,7 @@ const Orders_sub = () => { }, []) const data_source = orders_store.orderCountData_type; + const avg_line_y = data_source.length ? Math.round((data_source.reduce((a, b) => a + b.yField, 0)) / data_source.length) : 0;//平均值，显示一条平均线 const line = { data: data_source, padding: 'auto', @@ -33,6 +34,32 @@ const Orders_sub = () => { xAxis: { type: 'timeCat', }, + annotations: [ + { + type: 'text', + position: ['start', avg_line_y], + content: avg_line_y, + offsetX: -15, + style: { + fill: '#F4664A', + textBaseline: 'bottom', + } + }, + { + type: 'line', + start: [-10, avg_line_y], + end: ['max', avg_line_y], + style: { + stroke: '#F4664A', + lineDash: [2, 2], + }, + }, + ], + tooltip: { + title: (title, datum) => { + return title+' '+ comm.getWeek(datum.xField);//显示周几 + }, + }, label: {},//显示标签 legend: { title: { @@ -87,9 +114,10 @@ const Orders_sub = () => { key: 'COLI_WebCode', }, { - title: 'IP', - dataIndex: 'COLI_SenderIP', - key: 'COLI_SenderIP', + title: '成行', + dataIndex: 'COLI_Success', + key: 'COLI_Success', + render: (text, record) => {text == 1 ? '是' : '否'}, }, { title: '预定时间',