停车资源利用情况分析
-
+ {
+ ringData.series ?
+
:
+
暂无数据
+ }
停车资源利用率排行榜
diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/index.scss b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/index.scss
index 9ae92e3..b04793d 100644
--- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/index.scss
+++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/index.scss
@@ -418,4 +418,9 @@ $color-primary : var(--color-primary);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #3b97ff;
}
+}
+.no-data-box {
+ text-align: center;
+ height: 100px;
+ line-height: 100px;
}
\ No newline at end of file
diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx
index 9f72c0c..e22ac57 100644
--- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx
+++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx
@@ -173,12 +173,19 @@ function ParkingAlyPeriod() {
};
});
- setRevenueData({...lineChartOption(areaNames, xAxisData, "车次数（个）", seriesData),
- tooltip: {
- trigger: "axis",
- //formatter: "{a}
{b}：{c}",
- },
- });
+ let tooltip = {
+ formatter: (params) => {
+ var str = "";
+ str = params[0].axisValue.match(/(\S*):/) ? params[0].axisValue.match(/(\S*):/) : params[0].axisValue
+ str = str[1] ? str[1] + ':59时' : str
+ return `
+ ${params[0].axisValue}-${str}
+ 出场次数：${params[0].data}(次)
+ 入场次数：${params[1].data}(次)
+
`
+ }
+ }
+ setRevenueData({ ...lineChartOption(areaNames, xAxisData, "车次数（个）", seriesData), ...tooltip });
};
//停车饱和趋势分析分析 折线图
const getParkOption = (data) => {
@@ -657,21 +664,27 @@ function ParkingAlyPeriod() {
/>
{
- formData.paytype == 0 ? <>
-
-
- :
- <>
+ formData.paytype == 0 ?
+ (hourData.series ?
-
+ /> :
+
暂无数据
+ )
+ :
+ (
+ parkData.series ?
+
+ :
+
暂无数据
+ )
+
}
diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/index.scss b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/index.scss
index f14b7f8..9993d3b 100644
--- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/index.scss
+++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/index.scss
@@ -274,4 +274,9 @@ $color-primary : var(--color-primary);
margin-left: 20px;
}
}
+}
+.no-data-box {
+ text-align: center;
+ height: 100px;
+ line-height: 100px;
}
\ No newline at end of file
diff --git a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/loadable.jsx b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/loadable.jsx
index 996dcec..705f701 100644
--- a/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/loadable.jsx
+++ b/src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/loadable.jsx
@@ -26,7 +26,7 @@ function ParkingLiveData() {
const defaultData = {
start_time: moment().subtract('days').startOf('day').format("YYYY-MM-DD"),
end_time: moment().endOf("day").format("YYYY-MM-DD"),
- operator_id:'0',
+ operator_id: '0',
};
// 分页数据
const [pageInfo, setPageInfo] = useState({
@@ -90,7 +90,10 @@ function ParkingLiveData() {
// }, [isAjax]);
//出入场趋势
const getRevenueOption = (data) => {
- if (!data.entry_list) return
+ if (!data.entry_list || data.entry_list.length <= 0) {
+ setRevenueData({})
+ return
+ }
data.entry_list.sort((a, b) => {
return new Date(a.hour) - new Date(b.hour);
});
@@ -139,7 +142,19 @@ function ParkingLiveData() {
};
});
- setRevenueData(lineChartOption(areaNames, xAxisData, "数量（次）", seriesData));
+ let tooltip = {
+ formatter: (params) => {
+ var str = "";
+ str = params[0].axisValue.match(/(\S*):/) ? params[0].axisValue.match(/(\S*):/) : params[0].axisValue
+ str = str[1] ? str[1] + ':59' : str
+ return `
+ ${params[0].axisValue}-${str}
+ 入场次数：${params[0].data}(次)
+ 出场次数：${params[1].data}(次)
+
`
+ }
+ }
+ setRevenueData({ ...lineChartOption(areaNames, xAxisData, "数量（次）", seriesData), ...tooltip });
};
//泊位占用趋势
const getLineOption = (data) => {
@@ -147,7 +162,6 @@ function ParkingLiveData() {
setParkingData({})
return
}
- if (!data || data.length <= 0) return
// 获取所有地区名称
data.sort((a, b) => {
return new Date(a.hour) - new Date(b.hour);
@@ -194,7 +208,15 @@ function ParkingLiveData() {
};
});
- setParkingData(lineChartOption(areaNames, xAxisData, "泊位占用率", seriesData));
+ let tooltip = {
+ formatter: (params) => {
+ return `
+ 时间：${params[0].axisValue}
+ 占用率：${params[0].value}%
+
`
+ }
+ }
+ setParkingData({ ...lineChartOption(areaNames, xAxisData, "泊位占用率", seriesData), ...tooltip });
};
//泊位占用率 环形图
const getParkingOption = (data) => {
@@ -202,12 +224,21 @@ function ParkingLiveData() {
setRingData({})
return
}
- const areaNames = [data.vacant_name, data.occupied_name];
+ const areaNames = [data.occupied_name, data.vacant_name];
let todata = [
- { value: parseFloat(data.vacancy_rate), name: data.vacant_name },
- { value: parseFloat(data.occupancy_rate), name: data.occupied_name },
+ { value: parseFloat(data.vacancy_rate), name: data.vacant_name, num: data.vacant_berths },
+ { value: parseFloat(data.occupancy_rate), name: data.occupied_name, num: data.occupied_berths },
]
- setRingData(ringChartOption(areaNames, todata));
+ let tooltip = {
+ formatter: (params) => {
+ return `
+ ${params.name}
+ 数量：${params.data.num}(辆)
+ 占比：${params.data.value}%
+
`
+ }
+ }
+ setRingData(ringChartOption(areaNames, todata, tooltip));
};
//会员车占比 环形图
const getRingOption = (data) => {
@@ -217,10 +248,19 @@ function ParkingLiveData() {
}
const areaNames = [data.member_name, data.no_member_name];
let todata = [
- { value: parseFloat(data.member_car_percentage), name: data.member_name },
- { value: parseFloat(data.non_member_car_percentage), name: data.no_member_name },
+ { value: parseFloat(data.member_car_percentage), name: data.member_name, num: data.member_car_count },
+ { value: parseFloat(data.non_member_car_percentage), name: data.no_member_name, num: data.non_member_car_count },
]
- setCarData(ringChartOption(areaNames, todata));
+ let tooltip = {
+ formatter: (params) => {
+ return `
+ ${params.name}
+ 数量：${params.data.num}(辆)
+ 占比：${params.data.value}%
+
`
+ }
+ }
+ setCarData(ringChartOption(areaNames, todata, tooltip));
};
function getParkingIncome(data) {
@@ -382,10 +422,14 @@ function ParkingLiveData() {
>
?
-
+ {
+ ringData.series ?
+
:
+
暂无数据
+ }