From 22778bd78e346890f96ffc10b8c04c1743b7354d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=B9=E8=AF=9A=E8=AF=9A?= Date: Fri, 30 Sep 2022 12:04:07 +0800 Subject: [PATCH] =?UTF-8?q?=E6=98=BE=E7=A4=BA=E5=B9=B3=E5=9D=87=E7=BA=BF?= =?UTF-8?q?=20=E6=98=BE=E7=A4=BA=E5=91=A8=E5=87=A0=20=E8=AE=A2=E5=8D=95?= =?UTF-8?q?=E8=AF=A6=E6=83=85=E6=B7=BB=E5=8A=A0=E6=98=AF=E5=90=A6=E6=88=90?= =?UTF-8?q?=E8=A1=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/index.html | 4 +- src/stores/AuthStore.js | 2 +- src/stores/OrdersStore.js | 6 ++- src/utils/commons.js | 34 +++++++++++++--- src/views/Credit_card_bill.js | 20 +++++----- src/views/Orders.js | 75 ++++++++++++++++++++++++----------- src/views/Orders_sub.js | 34 ++++++++++++++-- 7 files changed, 126 insertions(+), 49 deletions(-) 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/stores/AuthStore.js b/src/stores/AuthStore.js index 7b44fcb..d5f70ce 100644 --- a/src/stores/AuthStore.js +++ b/src/stores/AuthStore.js @@ -9,7 +9,7 @@ class AuthStore { constructor(rootStore) { this.rootStore = rootStore; makeAutoObservable(this); - this.get_auth(); //放到钉钉环境才能开启 + //this.get_auth(); //放到钉钉环境才能开启 } auth = ['admin']; //开发时候用，正式环境留空 diff --git a/src/stores/OrdersStore.js b/src/stores/OrdersStore.js index c2d3bd4..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), diff --git a/src/utils/commons.js b/src/utils/commons.js index 7449ae4..f501970 100644 --- a/src/utils/commons.js +++ b/src/utils/commons.js @@ -5,6 +5,7 @@ import { CaretUpOutlined, CaretDownOutlined } from '@ant-design/icons'; +import moment from "moment"; if (!String.prototype.padStart) { String.prototype.padStart = function padStart(targetLength, padString) { @@ -197,21 +198,42 @@ export function clickUrl(url) { httpLink.click(); } -export function show_vs_tag(vs,vs_diff, data1, data2) { +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 { - // return {tag} - // } + }// else { + // tag = } color="lime">{vs} {vs_diff} + // } return
{data1} vs {data2}
{tag} } //数组去掉重复 -export function unique(arr){ +export function unique(arr) { let x = new Set(arr); return [...x]; -} \ No newline at end of file +} + +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 9206bcd..1b95e4d 100644 --- a/src/views/Credit_card_bill.js +++ b/src/views/Credit_card_bill.js @@ -132,14 +132,6 @@ const Credit_card_bill = () => { result.dataSource.push(...data.billdate1); } result.columns = [ - { - title: '项目', - children: [{ - title: '', - dataIndex: 'cb_bill', - }], - sorter: (a, b) => a.cb_bill.localeCompare(b.cb_bill), - }, { title: '项目类型', children: [{ @@ -153,6 +145,14 @@ const Credit_card_bill = () => { 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: [{ @@ -237,10 +237,10 @@ const Credit_card_bill = () => { - + - + {/**/} diff --git a/src/views/Orders.js b/src/views/Orders.js index dd377df..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: comm.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: comm.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: comm.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: comm.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: comm.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: comm.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: comm.show_vs_tag(item.OrderCount_vs, item.OrderCount, item2.OrderCount), - CJCount: comm.show_vs_tag(item.CJCount_vs, item.CJCount, item2.CJCount), - CJPersonNum: comm.show_vs_tag(item.CJPersonNum_vs, item.CJPersonNum, item2.CJPersonNum), - CJrate: comm.show_vs_tag(item.CJrate_vs, item.CJrate, item2.CJrate), - YJLY: comm.show_vs_tag(item.YJLY_vs, item.YJLY, item2.YJLY), - Ordervalue: comm.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, }; @@ -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: '预定时间',