diff --git a/src/components/LineWithKPI.jsx b/src/components/LineWithKPI.jsx index afdb70d..35bb1dd 100644 --- a/src/components/LineWithKPI.jsx +++ b/src/components/LineWithKPI.jsx @@ -1,6 +1,6 @@ import { observer } from 'mobx-react'; -import { DualAxes } from '@ant-design/plots'; -import { merge, pick, cloneDeep } from '../utils/commons'; +import { Line } from '@ant-design/plots'; +import { merge, isEmpty } from '../utils/commons'; import { dataFieldAlias } from '../libs/ht'; const uniqueByKey = (array, key, pickLast) => { @@ -26,46 +26,28 @@ const uniqueByKey = (array, key, pickLast) => { export default observer((props) => { const { config, dataSource, ...extProps } = props; const kpiKey = dataFieldAlias[config.yField]?.nestkey?.v; - const _data = uniqueByKey(dataSource, config.xField, true); // debug: - const mergeConfig = merge( - // color: ['#1979C9', '#F4664A', '#FAAD14'], - - // padding: 'auto', - // xField: 'groupDateVal', - // yField: 'SumML', - // seriesField: 'groupsLabel', - { - ...pick(config, ['padding', 'xField', 'seriesField']), - yField: [config.yField, kpiKey], - legend: false, - xAxis: { - type: 'cat', - }, - meta: { ...cloneDeep(dataFieldAlias) }, - geometryOptions: [ - { - geometry: 'line', - smooth: true, - point: { - size: 4, - shape: 'cicle', - }, - }, - { - geometry: 'line', - smooth: true, - point: { - size: 4, - shape: 'cicle', - }, - lineStyle: { - lineWidth: 1, - lineDash: [5, 5], - }, - color: '#F4664A', - }, - ], + const _data = dataSource.reduce((r, v) => { + r.push(v); + if ( ! isEmpty(v[kpiKey])) { // 有设目标才多显示一条虚线 颜色: #F4664A + r.push({...v, [config.yField]: v[kpiKey], [config.seriesField]: dataFieldAlias[kpiKey].label}); } - ); - return ; + return r; + }, []); + const mergeLineConfig = merge({ + color: ['#598cf3', '#F4664A', '#FAAD14'], + lineStyle: (data) => { + console.log(data); + if (data[config.seriesField].includes('目标')) { + return { + lineDash: [4, 4], + opacity: 0.5, + }; + } + + return { + opacity: 1, + }; + }, + }, config); + return ; }); diff --git a/src/components/Waterfall.jsx b/src/components/Waterfall.jsx index 2ec6bd6..87bf2ec 100644 --- a/src/components/Waterfall.jsx +++ b/src/components/Waterfall.jsx @@ -5,7 +5,7 @@ import { merge } from '../utils/commons'; export default observer((props) => { const { dataSource, line, title, ...extProps } = props; - const yMax = (Math.max(line?.value || 0, ...dataSource.map((ele) => ele[extProps.yField])))*1; + const yMax = (Math.max(line?.value || 0, (dataSource.reduce((r, ele) => r+ele[extProps.yField], 0))))*1; const annotationsLine = line ? [ { diff --git a/src/stores/Trade.js b/src/stores/Trade.js index 0806e18..50e2fed 100644 --- a/src/stores/Trade.js +++ b/src/stores/Trade.js @@ -15,7 +15,7 @@ class Trade { fetchSummaryData(queryData) { this.summaryData.loading = true; queryData.groupType = 'overview'; - // queryData.groupDateType = 'year'; + queryData.groupDateType = 'year'; this.fetchTradeData(queryData).then((json) => { if (json.errcode === 0) { runInAction(() => { diff --git a/src/views/Home.jsx b/src/views/Home.jsx index 92fe06c..e844003 100644 --- a/src/views/Home.jsx +++ b/src/views/Home.jsx @@ -7,7 +7,7 @@ import { useNavigate } from 'react-router-dom'; import StatisticCard from '../components/StatisticCard'; import Bullet from '../components/BulletWithSort'; import Waterfall from '../components/Waterfall'; -import LineMix from '../components/LineWithKPI'; +import LineWithKPI from '../components/LineWithKPI'; import DataFieldRadio from '../components/DataFieldRadio'; import { datePartOptions } from './../components/DateGroupRadio/date'; import SearchForm from './../components/search/SearchForm'; @@ -206,8 +206,8 @@ export default observer(() => { - - {/* */} + {/* */} +