Browse Source
Merge branch 'develop' of http://120.27.195.166:3000/chenglb/PMS_Frontend_v1.0.0.git into develop
Merge branch 'develop' of http://120.27.195.166:3000/chenglb/PMS_Frontend_v1.0.0.git into develop
# Conflicts: # src/pages/DataAnalysisPrediction/ParkingOverview/loadable.jsxtags/PMS_Frontend_v1.0.6-develop
chenglb
1 year ago
38 changed files with 1363 additions and 493 deletions
-
2src/components/DataSelect/index.jsx
-
117src/components/MapComponets/ParkingViewMarkers/index.jsx
-
39src/components/MapComponets/ParkingViewMarkers/index.scss
-
38src/components/TableModule/index.jsx
-
1src/pages/DataAnalysisPrediction/MemberStat/ParkingAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/MemberStat/PayAly/loadable.jsx
-
1src/pages/DataAnalysisPrediction/MemberStat/RegisterAly/loadable.jsx
-
8src/pages/DataAnalysisPrediction/ParkingBusinessAly/CarTypeAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingBusinessAly/NightParkStat/loadable.jsx
-
3src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/index.scss
-
9src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkBerthAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkTurnoverAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkUsageAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyDuration/loadable.jsx
-
3src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyOverview/loadable.jsx
-
244src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyPeriod/loadable.jsx
-
381src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyReport/index.scss
-
172src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyReport/loadable copy.jsx
-
522src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingAlyReport/loadable.jsx
-
4src/pages/DataAnalysisPrediction/ParkingBusinessAly/ParkingLiveData/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingBusinessAly/TemporaryParkStat/loadable.jsx
-
4src/pages/DataAnalysisPrediction/ParkingBusinessAly/echarts.config.js
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/ArrearageRecoverAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/CityArrearageAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/CityIncomeAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/CityIncomeStat/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/OrderArrearageAly/loadable.jsx
-
2src/pages/DataAnalysisPrediction/ParkingIncomeAly/PriceAly/loadable.jsx
-
20src/pages/DataAnalysisPrediction/ParkingOverview/Map.jsx
-
77src/pages/DataAnalysisPrediction/ParkingOverview/loadable.jsx
-
14src/pages/OperationCenter/CarMgm/CarInfo/loadable.jsx
-
50src/pages/OperationCenter/CustomerServieMgm/CallbackSuggestion/index.scss
-
84src/pages/OperationCenter/CustomerServieMgm/CallbackSuggestion/loadable.jsx
-
5src/pages/OperationCenter/UserMgm/UserInfo/index.scss
-
13src/pages/OperationCenter/UserMgm/UserInfo/loadable.jsx
-
10src/services/DataAnalysisPrediction/ParkingBusinessAly/index.js
-
9src/services/OperationCenter/CustomerManage/index.js
-
2src/services/ParkingOverview/index.js
@ -1,5 +1,386 @@ |
|||
@import "@/assets/css/mixin.scss"; |
|||
|
|||
$color-container-bg : var(--color-container-bg); |
|||
$color-user-list-bg : var(--color-user-list-bg); |
|||
$color-text : var(--color-text); |
|||
$color-primary : var(--color-primary); |
|||
|
|||
.edit-order-inquiry { |
|||
display: flex; |
|||
padding-top: 10px; |
|||
width: 100%; |
|||
height: 100%; |
|||
overflow-y: auto; |
|||
@include scrollBar(var(--color-user-list-bg), #3B97FF); |
|||
|
|||
.paid-search { |
|||
display: block; |
|||
width: 375px; |
|||
padding: 10px 10px 20px 20px; |
|||
|
|||
.title { |
|||
width: 100%; |
|||
font-size: 16px; |
|||
font-family: Microsoft YaHei, Microsoft YaHei-Bold; |
|||
font-weight: 700; |
|||
text-align: left; |
|||
color: var(--color-text); |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.form-Wrap { |
|||
height: calc(100% - 45px); |
|||
overflow-y: auto; |
|||
scrollbar-width: none; |
|||
-ms-overflow-style: none; |
|||
|
|||
&::-webkit-scrollbar { |
|||
display: none; |
|||
} |
|||
} |
|||
|
|||
.ant-select-selector, |
|||
.ant-picker, |
|||
.ant-input { |
|||
background-color: var(--color-search-list-item-bg) !important; |
|||
box-shadow: none !important; |
|||
color: var(--color-search-list-item-value); |
|||
border-color: var(--color-search-list-item-bd) !important; |
|||
} |
|||
|
|||
.yisa-search { |
|||
width: 100%; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-bottom: 24px; |
|||
|
|||
label { |
|||
color: var(--color-search-list-item-text); |
|||
flex: 0 0 27%; |
|||
max-width: 27%; |
|||
text-align: right; |
|||
padding-right: 8px; |
|||
|
|||
.daf { |
|||
display: inline-block; |
|||
} |
|||
} |
|||
|
|||
.form-con { |
|||
flex: 1; |
|||
width: 220px; |
|||
} |
|||
} |
|||
|
|||
.form-btn { |
|||
display: flex; |
|||
flex-flow: row nowrap; |
|||
justify-content: space-between; |
|||
margin: 40px 0px 0px; |
|||
padding: 0 3px; |
|||
|
|||
.ant-btn+.ant-btn { |
|||
margin-left: 10px; |
|||
} |
|||
|
|||
.ant-btn span { |
|||
font-size: 16px; |
|||
font-family: Microsoft YaHei, Microsoft YaHei-Regular; |
|||
font-weight: 400; |
|||
text-align: center; |
|||
color: #ffffff; |
|||
} |
|||
|
|||
.reset { |
|||
width: 90px; |
|||
height: 36px; |
|||
background: var(--button-default-bg); |
|||
} |
|||
|
|||
.submit { |
|||
width: calc(100% - 100px); |
|||
height: 36px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.ant-btn+.ant-btn { |
|||
margin-left: 10px; |
|||
} |
|||
|
|||
.green { |
|||
background-color: #67c23a; |
|||
border-color: #67c23a; |
|||
} |
|||
|
|||
.soll-result { |
|||
overflow: auto; |
|||
|
|||
.result { |
|||
display: block !important; |
|||
} |
|||
} |
|||
|
|||
.paid-result { |
|||
width: calc(100% - 375px); |
|||
padding-bottom: 15px; |
|||
padding: 20px; |
|||
background: var(--color-user-list-bg); |
|||
border-top-left-radius: 20px; |
|||
box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.08); |
|||
|
|||
.result-hd-overview { |
|||
color: #ffffff; |
|||
//background: #3e4557; |
|||
border-radius: 4px; |
|||
margin-bottom: 20px; |
|||
display: flex; |
|||
|
|||
.result-header { |
|||
height: 108px; |
|||
width: 33%; |
|||
margin: 0 10px; |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
.result-content { |
|||
margin: auto; |
|||
|
|||
.title { |
|||
height: 19px; |
|||
font-size: 14px; |
|||
font-family: Microsoft YaHei, Microsoft YaHei-Regular; |
|||
font-weight: 400; |
|||
text-align: center; |
|||
color: #DBE5FF; |
|||
display: inline-block; |
|||
} |
|||
|
|||
i { |
|||
border: 1px solid; |
|||
border-radius: 22px; |
|||
display: inline-block; |
|||
text-align: center; |
|||
font-size: 10px; |
|||
width: 15px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.num { |
|||
height: 27px; |
|||
font-size: 20px; |
|||
font-family: Alibaba PuHuiTi, Alibaba PuHuiTi-Bold; |
|||
font-weight: 700; |
|||
text-align: left; |
|||
color: #ffffff; |
|||
text-align: center; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.rea { |
|||
background: url("../../../../assets/images/red.png"); |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.reb { |
|||
background: url("../../../../assets/images/blue.png"); |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.rec { |
|||
background: url("../../../../assets/images/green.png"); |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.red { |
|||
background: url("../../../../assets/images/yellow.png"); |
|||
background-size: 100% 100%; |
|||
} |
|||
} |
|||
|
|||
.result { |
|||
@include flex-columns; |
|||
|
|||
.result-box { |
|||
color: #ffffff; |
|||
background: #3e4557; |
|||
border-radius: 4px; |
|||
margin-bottom: 20px; |
|||
|
|||
.result-box-title { |
|||
height: 21px; |
|||
font-size: 16px; |
|||
font-family: Microsoft YaHei, Microsoft YaHei-Bold; |
|||
font-weight: 700; |
|||
text-align: left; |
|||
margin: 18px 0 18px 18px; |
|||
display: inline-block; |
|||
|
|||
} |
|||
|
|||
i { |
|||
border: 1px solid; |
|||
border-radius: 22px; |
|||
display: inline-block; |
|||
text-align: center; |
|||
font-size: 12px; |
|||
width: 22px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.ant-table .ant-table-thead tr th { |
|||
background: #3e4557; |
|||
} |
|||
} |
|||
.result-title { |
|||
display: inline-block; |
|||
p { |
|||
display: inline; |
|||
margin: 0 5px; |
|||
color: #3aa9ff; |
|||
font-size: 18px; |
|||
} |
|||
} |
|||
.export-btn { |
|||
display: inline-block; |
|||
text-align: center; |
|||
float: right; |
|||
width: 68px; |
|||
height: 34px; |
|||
line-height: 34px; |
|||
background: linear-gradient(180deg, #3aa9ff, #59b7ff); |
|||
border-radius: 4px; |
|||
margin-right: 15px; |
|||
margin-bottom: 10px; |
|||
cursor: pointer; |
|||
} |
|||
.row-head { |
|||
height: 32px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
margin-bottom: 13px; |
|||
|
|||
.number-wrapper { |
|||
display: inline-flex; |
|||
align-items: center; |
|||
font-size: 14px; |
|||
|
|||
.letter { |
|||
color: var(--color-text); |
|||
font-size: 14px; |
|||
} |
|||
|
|||
.total-number { |
|||
color: var(--color-primary); |
|||
font-weight: bold; |
|||
margin: 0 4px; |
|||
font-size: 14px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.cc-result-flow { |
|||
width: 100%; |
|||
height: calc(100% - 34px - 13px); |
|||
|
|||
.yisa-table { |
|||
width: 100%; |
|||
height: calc(100% - 32px - 15px); |
|||
overflow-y: auto !important; |
|||
@include scrollBar(var(--color-user-list-bg), #3B97FF); |
|||
|
|||
.ant-table-thead { |
|||
th { |
|||
background: #616b83 !important; |
|||
} |
|||
} |
|||
|
|||
.ant-table-tbody { |
|||
td { |
|||
background: #3E4557 !important; |
|||
border-bottom-color: var(--color-table-border-bottom-color); |
|||
} |
|||
|
|||
tr:nth-child(even) { |
|||
td { |
|||
background: #3E4557 !important; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
.modal-pay-configuration { |
|||
|
|||
.submitBtn { |
|||
text-align: center; |
|||
margin: 20px 0 0; |
|||
|
|||
.ant-btn { |
|||
width: 80px; |
|||
height: 35px; |
|||
border: none; |
|||
border-radius: 4px; |
|||
|
|||
span { |
|||
color: #ffffff; |
|||
} |
|||
} |
|||
|
|||
.submit { |
|||
background: #409eff; |
|||
} |
|||
|
|||
.cancel { |
|||
background: var(--button-default-bg); |
|||
margin-left: 20px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.tab-title { |
|||
display: flex; |
|||
|
|||
.title { |
|||
height: 30px; |
|||
line-height: 30px; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.btn { |
|||
font-size: 10px; |
|||
} |
|||
} |
|||
|
|||
.edit-order-inquiry { |
|||
/*定义滚动条高宽及背景 |
|||
高宽分别对应横竖滚动条的尺寸*/ |
|||
::-webkit-scrollbar { |
|||
width: 6px; |
|||
height: 16px; |
|||
background-color: #5c5c5c; |
|||
} |
|||
|
|||
/*定义滚动条轨道 |
|||
内阴影+圆角*/ |
|||
::-webkit-scrollbar-track { |
|||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); |
|||
border-radius: 10px; |
|||
background-color: #9da2ab; |
|||
} |
|||
|
|||
/*定义滑块 |
|||
内阴影+圆角*/ |
|||
::-webkit-scrollbar-thumb { |
|||
border-radius: 10px; |
|||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); |
|||
background-color: #3b97ff; |
|||
} |
|||
} |
|||
@ -0,0 +1,172 @@ |
|||
import React, { useState, useRef, useEffect } from "react"; |
|||
import { |
|||
message, |
|||
Pagination, |
|||
Table, |
|||
Input, |
|||
Space, |
|||
Modal, |
|||
Button, |
|||
Select, |
|||
Tabs, |
|||
Descriptions, |
|||
Timeline |
|||
} from "antd"; |
|||
import moment from "moment"; |
|||
import ajax from '@/services' |
|||
import { TableModule } from "@/components"; |
|||
import { dictionary } from "@/config/common.js"; |
|||
import "./index.scss"; |
|||
function ParkingAlyReport() { |
|||
const [resultData, setResultData] = useState([]) |
|||
const [total, setTotal] = useState(0); |
|||
const [searchSelectList, setSearchSelectList] = useState([]); //搜索下拉数据 |
|||
const columns = [ |
|||
{ |
|||
title: "停车场名称", |
|||
dataIndex: "road_name", |
|||
key: "road_name", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "泊位总数", |
|||
dataIndex: "total_berths", |
|||
key: "total_berths", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "停车记录数（次）", |
|||
dataIndex: "record_count", |
|||
key: "record_count", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "订单应收金额（元）", |
|||
dataIndex: "receivable_amount", |
|||
key: "receivable_amount", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "日均泊位周转次数（次）", |
|||
dataIndex: "average_turn_times", |
|||
key: "average_turn_times", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "平均泊位利用率", |
|||
dataIndex: "average_use_rate", |
|||
key: "average_use_rate", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
{ |
|||
title: "平均停车时长", |
|||
dataIndex: "average_park_time", |
|||
key: "average_park_time", |
|||
align: "center", |
|||
fixed: "right", |
|||
}, |
|||
]; |
|||
|
|||
//检索条件 |
|||
const formSearch = [ |
|||
{ |
|||
name: "area_id", |
|||
type: "TreeSelect", |
|||
label: "区域", |
|||
}, |
|||
{ |
|||
name: "operator_id", |
|||
type: "Select", |
|||
label: "运营商", |
|||
options: searchSelectList || [], |
|||
}, |
|||
{ |
|||
name: "car_parking_type", |
|||
type: "Select", |
|||
label: "车场类型", |
|||
options: [ |
|||
{ |
|||
label: '全部', |
|||
value: '3', |
|||
}, |
|||
{ |
|||
label: '路内车场', |
|||
value: '1', |
|||
}, |
|||
{ |
|||
label: '路外车场', |
|||
value: '2', |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
name: "road_name", |
|||
type: "Input", |
|||
label: "停车场", |
|||
placeholder: "请输入停车场名称", |
|||
}, |
|||
{ |
|||
name: "timePeriod", |
|||
type: "RangePicker", |
|||
label: "时间段", |
|||
defaultValue: [moment().startOf("day"), moment()], |
|||
}, |
|||
]; |
|||
|
|||
//列表数据 |
|||
function search(e) { |
|||
ajax.getParkingAlyReportList(e).then((res) => { |
|||
let { status, data, total } = res |
|||
if (status == 20000) { |
|||
if (data.list) { |
|||
setResultData(data.list) |
|||
setTotal(data.total_records) |
|||
} else { |
|||
setResultData(data) |
|||
setTotal(total) |
|||
} |
|||
} else { |
|||
setResultData([]) |
|||
message.error(res.message) |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 获取下拉数据 |
|||
const getSelectList = () => { |
|||
ajax.getOperator().then((e) => { |
|||
setSearchSelectList([ |
|||
...searchSelectList, |
|||
...e.data |
|||
]) |
|||
}) |
|||
}; |
|||
|
|||
useEffect(() => { |
|||
getSelectList(); |
|||
}, []); |
|||
|
|||
return ( |
|||
<> |
|||
<TableModule |
|||
columns={columns} |
|||
tableData={resultData} |
|||
formSearch={formSearch} |
|||
search={search} |
|||
total={total} |
|||
rowKey={"road_name"} |
|||
exportUrl={'/api/ana/dataanalysis/parking_total_analysis_export'} |
|||
initFormData={{}} |
|||
pageName={'parkingAlyReport'} |
|||
/> |
|||
</> |
|||
); |
|||
} |
|||
|
|||
export default ParkingAlyReport; |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue