diff --git a/src/components/DataSelect/index.jsx b/src/components/DataSelect/index.jsx index 2a6ef3c..47084a2 100644 --- a/src/components/DataSelect/index.jsx +++ b/src/components/DataSelect/index.jsx @@ -17,7 +17,7 @@ function DataSelect(props) { //时间状态切换 const TimeChange = () => { let e = formData?.date_type||''; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; diff --git a/src/components/MapComponets/ParkingViewMarkers/index.jsx b/src/components/MapComponets/ParkingViewMarkers/index.jsx index 16fd2de..384ce0f 100644 --- a/src/components/MapComponets/ParkingViewMarkers/index.jsx +++ b/src/components/MapComponets/ParkingViewMarkers/index.jsx @@ -3,6 +3,7 @@ import "./index.scss"; import mgreen from "@/assets/images/equip/home/mark_green.png"; import mgred from "@/assets/images/equip/home/mark_red.png"; import mgyellow from "@/assets/images/equip/home/mark_yellow.png"; +//当前移入点 function Markers(props) { const map = props.__map__; @@ -12,9 +13,9 @@ function Markers(props) { iconAnchor = [15, 20], // 图片偏移量 tooltipKey = "name", // 提示信息的key // contentCb, // 生成弹窗显示内容方法事件 + mover = false, clickCb, // 点击事件 } = props; - //当前移入点 var Mapmove = new AMap.Marker({ content: " ", map: map }); const [massLayer, setMassLayer] = useState(null); // 海量点图层 const massLayerRef = useRef(massLayer); @@ -75,7 +76,7 @@ function Markers(props) { if (map && !massLayer) { let _massLayer = new AMap.MassMarks([], { zIndex: 5, // 海量点图层叠加的顺序 - cursor: "pointer", + // cursor: "pointer", style: style, // 该层内标注是否避让 // allowCollision: true, }); // 创建海量点图层 @@ -126,99 +127,33 @@ function Markers(props) { const addMarker = (markerArr, _massLayer) => { _massLayer.setData(markerArr); _massLayer.on("click", function (e) { - console.log(e.data.option); clickCb(e.data.option); - // Mapmove.setPosition(e.data.lnglat); }); - setMassLayer(_massLayer); - _massLayer.setMap(map); - - // for (let [key, value] of Object.entries(markerArr)) { - // if (!value.hasOwnProperty("massMarkers")) { - // value.massMarkers = []; - // value.nodes.forEach((elem) => { - // console.log(elem); - // // let marker = new AMap.LabelMarker({ - // // position: [elem.lnglat[1], elem.lnglat[0]], - // // // zIndex: 1006, - // // icon: icon(elem.type), - // // // text: text(elem[tooltipKey]), - // // // content: markerContent(elem.type), - // // // offset: new AMap.Pixel(-13, -30), - // // }); + if (mover) { + _massLayer.on("mouseover", function (e) { + Mapmove.setPosition(e.data.lnglat); + Mapmove.setLabel({ + content: `${e.data.name} (${e.data?.option?.userTotal}/${e.data?.option?.berthTotal})`, + }); + // if (position) { + // Mapmove.setContent( + // '
' + + // position + + // '
' + + // "
" + // ); + // Mapmove.setPosition(position); + // // map.add(Mapmove); + // } + }); - // // marker.data = elem; - // // value.massMarkers.push(marker); - // // // marker.bindTooltip(`${elem[tooltipKey]}`, { - // // // offset: [20, -5], - // // // direction: "right", - // // // }); - // // marker.on("mouseover", function (e) { - // // console.log(e.data); - // // var position = e.data.data && e.data.data.position; - // // if (position) { - // // Mapmove.setLabel( - // // '
' + - // // position + - // // '
' + - // // "
" - // // ); - // // Mapmove.setPosition(position); - // // map.add(Mapmove); - // // } - // // }); - // // marker.on("mouseout", function () { - // // map.remove(Mapmove); - // // }); - // }); - // _massLayer.add(value.massMarkers); - // } else { - // _massLayer.add(value.massMarkers); - // } - // } - // _massLayer.setData(markerArr); - // massMarks.setMap(map); - // if (clickCb) { - // _massLayer.on("click", (e) => { - // console.log(e); - // // if (data.length == "1") { - // // let elem = data[0].data.data.data; - // // clickCb(elem); - // // } else { - // // map.openPopup(renderMarkerList(data), e.latlng, { - // // className: "markers-list-box", - // // }); - // // let dom = document.querySelectorAll(".marker-list-item"); - // // dom.forEach((elem) => { - // // elem.addEventListener("click", function (e) { - // // map.closePopup(); - // // let type = e.target.dataset.type, - // // id = e.target.dataset.id; - // // let marker = massObjRef.current["type_" + type].nodes.filter( - // // (i) => i.locationId == id - // // )[0]; - // // let elem = marker.data; - // // clickCb(elem); - // // }); - // // }); - // // } - // }); - // } - }; + // _massLayer.on("mouseout", function () { + // map.remove(Mapmove); + // }); + } - const renderMarkerList = (data) => { - let template = `
-
请选择点位
-
- `; - data.forEach((elem) => { - let _data = elem.data.data; - if (_data.name && _data.locationId) { - template += `
${_data.name}
`; - } - }); - template += `
`; - return template; + // setMassLayer(_massLayer); + _massLayer.setMap(map); }; return null; diff --git a/src/components/MapComponets/ParkingViewMarkers/index.scss b/src/components/MapComponets/ParkingViewMarkers/index.scss index a46817b..50e3f72 100644 --- a/src/components/MapComponets/ParkingViewMarkers/index.scss +++ b/src/components/MapComponets/ParkingViewMarkers/index.scss @@ -82,22 +82,27 @@ font-size: 14px; } -.amap-info-window { - width: 150px; - background: #fff; - border-radius: 3px; - padding: 3px 7px; - box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5); - position: relative; -} +// .amap-info-window { +// width: 150px; +// background: #fff; +// border-radius: 3px; +// padding: 3px 7px; +// box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5); +// position: relative; +// } -.amap-info-sharp { - position: absolute; - top: 21px; - bottom: 0; - left: 50%; - margin-left: -8px; - border-left: 8px solid transparent; - border-right: 8px solid transparent; - border-top: 8px solid #fff; +// .amap-info-sharp { +// position: absolute; +// top: 21px; +// bottom: 0; +// left: 50%; +// margin-left: -8px; +// border-left: 8px solid transparent; +// border-right: 8px solid transparent; +// border-top: 8px solid #fff; +// } +.amap-marker { + .amap-marker-label { + color: #172c4d; + } } \ No newline at end of file diff --git a/src/components/TableModule/index.jsx b/src/components/TableModule/index.jsx index ae32ac0..95929d4 100644 --- a/src/components/TableModule/index.jsx +++ b/src/components/TableModule/index.jsx @@ -53,8 +53,9 @@ const TableModule = forwardRef((props, ref) => { userInfo = {},//用户信息页面数据 valueChange, mandatory, - locale={}, + locale = {}, limitCon,//自定义限制条件 + isQuickMenu = [], mandatory_name, pageName = '',//路由名字 } = props; @@ -197,6 +198,7 @@ const TableModule = forwardRef((props, ref) => { //重置 function reset() { searchForm.resetFields(); + setFormData({}) fetch() } function cascaderChange(value, options) { @@ -488,21 +490,21 @@ const TableModule = forwardRef((props, ref) => {
- { - //setDeftime(v); - toDeftime(v, item.defaultName) - }} /> + 0 ? isQuickMenu : [ + { text: '昨日', value: 1 }, + { text: '今日', value: 0 }, + { text: '近三日', value: 2 }, + { text: '近一周', value: 6 }, + { text: '近一月', value: 29 }, + { text: '近半年', value: 180 }, + { text: '近一年', value: 365 }, + { text: '近两年', value: 730 }, + ]} + onChange={(v) => { + //setDeftime(v); + toDeftime(v, item.defaultName) + }} />
@@ -581,6 +583,10 @@ const TableModule = forwardRef((props, ref) => { if (form.start_time !== void 0 && form.end_time !== void 0) { form.start_time = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); form.end_time = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); + if (exportUrl == "/api/ope/record/recharge_export") { //特殊情况，用户信息的充值记录导出 + form.startTime = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); + form.endTime = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); + } } exportAjax({ url: exportUrl, diff --git a/src/pages/DataAnalysisPrediction/MemberStat/ParkingAly/loadable.jsx b/src/pages/DataAnalysisPrediction/MemberStat/ParkingAly/loadable.jsx index d123da7..5fafbe7 100644 --- a/src/pages/DataAnalysisPrediction/MemberStat/ParkingAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/MemberStat/ParkingAly/loadable.jsx @@ -229,6 +229,7 @@ function ParkingAly() { const ReportPaySummaryReport = () => { ajax.ElectInvoice.exportParking({ ...FormDatas, + ...DateFormt(FormDatas.date_type), }).then( (res) => { if (parseInt(res?.status) === 20000) { diff --git a/src/pages/DataAnalysisPrediction/MemberStat/PayAly/loadable.jsx b/src/pages/DataAnalysisPrediction/MemberStat/PayAly/loadable.jsx index 38c0bc1..fcde1d9 100644 --- a/src/pages/DataAnalysisPrediction/MemberStat/PayAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/MemberStat/PayAly/loadable.jsx @@ -242,7 +242,7 @@ function PayAly() { const ReportPaySummaryReport = () => { ajax.ElectInvoice.exportPayFx({ ...FormDatas, - is_excel: 1, + ...DateFormt(FormDatas.date_type), }).then( (res) => { if (parseInt(res?.status) === 20000) { diff --git a/src/pages/DataAnalysisPrediction/MemberStat/RegisterAly/loadable.jsx b/src/pages/DataAnalysisPrediction/MemberStat/RegisterAly/loadable.jsx index a8ad728..5bb41a8 100644 --- a/src/pages/DataAnalysisPrediction/MemberStat/RegisterAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/MemberStat/RegisterAly/loadable.jsx @@ -232,6 +232,7 @@ function RegisterAly() { const ReportPaySummaryReport = () => { ajax.ElectInvoice.exportRegister({ ...FormDatas, + ...DateFormt(FormDatas.date_type), }).then( (res) => { if (parseInt(res?.status) === 20000) { diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/CarTypeAly/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/CarTypeAly/loadable.jsx index ea539a5..e168a34 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/CarTypeAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/CarTypeAly/loadable.jsx @@ -26,8 +26,8 @@ function CarTypeAly() { start_time: moment().subtract('days').startOf('day').format("YYYY-MM-DD"), end_time: moment().endOf("day").format("YYYY-MM-DD"), date_type: '1', - type:'region', - car_parking_type:"3", + type: 'region', + car_parking_type: "3", }; // 分页数据 const [pageInfo, setPageInfo] = useState({ @@ -135,7 +135,7 @@ function CarTypeAly() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; @@ -325,7 +325,7 @@ function CarTypeAly() { const handleExport = () => { if (resultData.list.length > 0) { let { pn, page_size, ...params } = defaultParams; - ajax.getCarTypeAlyListExp(defaultParams).then( + ajax.getCarTypeAlyListExp({ ...defaultParams, export: 1 }).then( (res) => { if (res) { window.open(res.data.export_url) diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/NightParkStat/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/NightParkStat/loadable.jsx index e7a7c09..888437f 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/NightParkStat/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/NightParkStat/loadable.jsx @@ -184,7 +184,7 @@ function NightParkStat() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/index.scss b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/index.scss index c11bbaf..abee6d9 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/index.scss +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/index.scss @@ -301,6 +301,9 @@ $color-primary : var(--color-primary); background: #3e4557; width: 50%; margin-right: 20px; + .title-text { + margin-left: 20px; + } } .parkBerth-right { diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/loadable.jsx index 05cb491..c9623ca 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/loadable.jsx @@ -181,8 +181,8 @@ function ParkBerthAly() { let acc = [] data.map((item) => { let acr = [] - acr.push(item.average_duration) acr.push(item.turnover) + acr.push(item.average_duration) acc.push(acr) }) // 构建X轴数据 @@ -238,7 +238,7 @@ function ParkBerthAly() { }, yAxis: { //type: "value", - // name: yAxisName ? yAxisName : '', + name: '小时', axisLine: { show: false, }, @@ -255,6 +255,7 @@ function ParkBerthAly() { //color: ["#3AA9FF", "#F997DF"], series: [ { + name:'平均停车时长', symbolSize: 20, data: acc, type: 'scatter' @@ -304,7 +305,7 @@ function ParkBerthAly() { if (parseInt(res?.status) === 20000) { setResultData(res?.data || {}); if (res.data?.list?.length > 0) { - setBaseData(res?.data?.list[0]) + setBaseData({ ...res?.data?.list[0], all_utilization_rate: res?.data?.all_utilization_rate }) getParkingIncome({ ...postData, ...v, ...pageInfo, road_id: res?.data?.list[0].road_id }) } let maker = [] @@ -381,7 +382,7 @@ function ParkBerthAly() { > ? -
全部车场日均泊位时长利用率:{ }
+
全部车场日均泊位时长利用率:{baseData.all_utilization_rate || "--"}%
{ let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkUsageAly/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkUsageAly/loadable.jsx index a0f55bb..168b23e 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkUsageAly/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkUsageAly/loadable.jsx @@ -112,7 +112,7 @@ function ParkUsageAly() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyDuration/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyDuration/loadable.jsx index 51b5936..f75ef0f 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyDuration/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyDuration/loadable.jsx @@ -237,7 +237,7 @@ function ParkingAlyDuration() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyOverview/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyOverview/loadable.jsx index 32b893b..9085854 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyOverview/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyOverview/loadable.jsx @@ -186,7 +186,7 @@ function ParkingAlyOverview() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; @@ -533,6 +533,7 @@ function ParkingAlyOverview() { allowClear={false} value={formData.start_time ? moment(formData.start_time) : null} onChange={(date, dateString) => { + console.log(536,date,dateString) if (TimeChange().str == "week") { setFormData({ ...formData, diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx index 677ae77..313c2d6 100644 --- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx +++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx @@ -22,6 +22,7 @@ function ParkingAlyPeriod() { start_time: moment().subtract('days').startOf('day').format("YYYY-MM-DD"), end_time: moment().endOf("day").format("YYYY-MM-DD"), date_type: '1', + paytype: '0' }; // 分页数据 const [pageInfo, setPageInfo] = useState({ @@ -50,6 +51,7 @@ function ParkingAlyPeriod() { const [revenueData, setRevenueData] = useState({}); //停车饱和度趋势分析 const [parkData, setParkData] = useState({}); + const [hourData, setHourData] = useState({}); const [searchSelectList, setSearchSelectList] = useState([]); //搜索下拉数据 const [sessionTabList, setSessionTabList] = useSessionStorageState('parkingAlyPeriod', { value: { @@ -83,7 +85,7 @@ function ParkingAlyPeriod() { //时间状态切换 const TimeChange = () => { let e = formData.date_type; - let str = "day"; + let str = "date"; let mat = "YYYY-MM-DD"; if (e == 4) { str = "year"; @@ -168,161 +170,15 @@ function ParkingAlyPeriod() { }; //停车饱和趋势分析分析 折线图 const getParkOption = (data) => { - // data = [ - // { - // "hour": 0, - // "occupancy_rate": "0.01%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 1, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 2, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 3, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 4, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 5, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 6, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 7, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 8, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 9, - // "occupancy_rate": "0.1%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 10, - // "occupancy_rate": "0.01%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 11, - // "occupancy_rate": "0.04%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 12, - // "occupancy_rate": "0.06%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 13, - // "occupancy_rate": "0.04%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 14, - // "occupancy_rate": "0.06%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 15, - // "occupancy_rate": "0.01%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 16, - // "occupancy_rate": "0.04%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 17, - // "occupancy_rate": "0.04%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 18, - // "occupancy_rate": "0.07%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 19, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 20, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 21, - // "occupancy_rate": "0.01%", - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 22, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // }, - // { - // "hour": 23, - // "occupancy_rate": 0, - // "charge_type": "2", - // "charge_type_name": "二类区" - // } - // ] - const areaNames = data[0].charge_type_name ? [...new Set(data.map((item) => item.charge_type_name))] : ['']; + let areaNames = data[0].charge_type_name ? [...new Set(data.map((item) => item.charge_type_name))] : ['']; // 获取所有横坐标 - const dates = [...new Set(data.map((item) => item.hour))].sort( + let dates = [...new Set(data.map((item) => item.hour))].sort( (a, b) => a.hour - b.hour ); // 构建数据对象 - const seriesData = areaNames.map((areaName, index) => { + let seriesData = areaNames.map((areaName, index) => { // 获取数据 - const areaData = data[0].charge_type_name ? data.filter((item) => item.charge_type_name === areaName) : data + let areaData = data[0].charge_type_name ? data.filter((item) => item.charge_type_name === areaName) : data // 构建数据对象 return { name: areaName, @@ -336,7 +192,7 @@ function ParkingAlyPeriod() { }, }, data: dates.map((item) => { - for (const { hour, occupancy_rate } of areaData) { + for (var { hour, occupancy_rate } of areaData) { if (hour === item) return parseFloat(occupancy_rate); } return 0; @@ -344,7 +200,7 @@ function ParkingAlyPeriod() { }; }); // 构建X轴数据 - const xAxisData = dates.map((date) => { + let xAxisData = dates.map((date) => { return { value: date, align: "center", @@ -356,9 +212,54 @@ function ParkingAlyPeriod() { }; }); - setParkData(lineChartOption(areaNames, xAxisData, "饱和度", seriesData)); + setParkData(lineChartOption(areaNames, xAxisData, "饱和度", seriesData,areaNames)); }; + //停车饱和趋势分析分析 折线图 hour 时间对比 + const getParkOptionHour = (data) => { + let areaNames = data[0].date ? [...new Set(data.map((item) => item.date))] : ['']; + // 获取所有横坐标 + let dates = [...new Set(data.map((item) => item.hour))].sort( + (a, b) => a.hour - b.hour + ); + // 构建数据对象 + let seriesData = areaNames.map((areaName, index) => { + // 获取数据 + let areaData = data[0].date ? data.filter((item) => item.date === areaName) : data + // 构建数据对象 + return { + name: areaName, + type: "line", + itemStyle: { + label: { + show: true, //开启显示 + position: 'top', //在上方显示 + color: 'white',//字体颜色 + fontSize: 10//字体大小 + }, + }, + data: dates.map((item) => { + for (var { hour, occupancy_rate } of areaData) { + if (hour === item) return parseFloat(occupancy_rate); + } + return 0; + }), + }; + }); + // 构建X轴数据 + let xAxisData = dates.map((date) => { + return { + value: date, + align: "center", + lineStyle: { + color: "skyblue", // 设置线的颜色为天蓝色 + shadowBlur: 6, + }, + }; + }); + + setHourData(lineChartOption(areaNames, xAxisData, "饱和度", seriesData)); + }; function getParkingIncome(data) { ajax .getParkingAlyPeriodLine(data) @@ -375,7 +276,9 @@ function ParkingAlyPeriod() { .getParkingAlyPeriodParkLine(data) .then((res) => { if (res.status === 20000) { - getParkOption(res.data.list); + getParkOption(res.data.list?.area_list); + getParkOptionHour(res.data.list?.hour_list); + } }) .catch((err) => console.error(err)); @@ -688,6 +591,7 @@ function ParkingAlyPeriod() { ? @@ -704,7 +608,7 @@ function ParkingAlyPeriod() { + setFormData({ ...formData, operator_id: v }) + } + /> +
+
+ + + setFormData({ ...formData, road_name: e.target.value }) + } + /> +
+ +
+