1. 智慧停车
-
支持模式
- 封闭性单个停车场
- 路边停车(车位级管理)
- 大小场(场中场)，多场子并行或嵌套
-
所有者模式
- 统一平台管理
- 总平台下子账号(区域代理)自建场地资源，自行维护数据
- 总平台下子账号(区域代理)再分配和单个停车场管理人员(物业管理/维保/保安/财务等人员)
-
场站管理
- 【车位控制】
精准的实时车位统计和数据及时推送到场地led/lcd屏幕，车位满后禁止车辆进入 - 【责任制】
每个场地标记所有者，负责人信息，有需要直连联系实际控制负责人 - 【完整证据链】
详细实时记录每一辆车进出时间/场地/进出口/值班人员/图片/视频/金额/优惠/车辆情况(车辆类型|套餐|颜色|品牌)/开闸情况
- 【车位控制】
-
值班调度
- 【值守模式】
支持有人值守/无人值守/统一远程值守调度，数字数据全自动化录入，处理，资产数据产出并计算汇报展现 - 【重复过滤】
支持入场二次确认，避免路过和倒车车辆误拍产生歧义账单。短时间内重复多次抓拍只记录一条数据 - 【无处可逃】
出场跟车逃费标记，逃费入场提示追缴，补缴入场。支持单场追缴和全网追缴。黑名单通知，违法在逃车辆协同公安网络实时上报 - 【万无一失】
入场车牌识别错误可手动校正车牌，出场识别错误自动模糊相似车牌尝试匹配 - 【应急响应】
支持一键放行，处理紧急情况，手动免单。支持远程可视对讲。 - 【特殊群体】
支持自定义公务车自动免单放行，例如警车，军车，大使馆车，消防车等 - 【断电断网】
断电支持值守人员手机一键进出场拍照录入，入场录入人工放行入场，出场时值守人员向车主展示账单，车主扫码支付离场。 断网支持硬件设备白名单快速自动放行。保障断网解决方案：增加车牌识别相机4G模块/或者使用双网络路由器(4G/有线智能切换) - 【安保互动】
支持入场时值守人员留言，出场时备注留言提示 - 【一码识车】
新车无牌/车牌受污/车牌变形/非常规车牌无法识别/三轮代步车等，一键扫码自助入场，扫码缴费出场。公众号/小程序/APP数据一号互通
- 【值守模式】
-
进出控制与显示
- 【私人定制】
支持自定义车辆类型，每个停车场都可以单独对每种车辆类型设定独立的进出收费规则，放行规则，文字播报，语音提示，图片，视频等 例如黑名单禁止入场，且禁止录入数据，并提示。免费车，在有效期内，享受不一样的停车特权 - 【停车VIP】
每个停车场都可以独立发行内部和公开的车辆套餐产品，车主可以通过手机端新购和续费停车套餐，生效期进出无阻，套餐即将过期通知续费 例如黑名单禁止入场，且禁止录入数据，并提示。免费车，在有效期内，享受不一样的停车特权 - 【特殊车辆】
例如日包车(白天停车免费)，夜包车(晚上停车免费)。支持特殊车辆自助购买和续费，弥补车辆套餐不够灵活的缺陷
- 【私人定制】
-
车位管理
- 【多位多车】
支持一位多车和多位多车自动切换享受套餐停车特权 - 【神圣私产】
支持车位级别管理，车位主人一键扫码升降地锁 - 【车位共享】
支持公共车位扫码降锁入位，计时，超时扫码缴费降锁离场 - 【快速停车】
手机端实时数据显示当前位置和目的地附近停车场车位情况(余位/价格/免停时长/禁停时段/车场图片/具体位置)，可一键导航到空位车 - 【反向寻车】
面对复杂多层大型停车场(例如：大型商场地下停车场，机场，超大型立体停车楼等)，忘记了自己停在几楼哪个车位，利用车位相机自动记录 您车辆所在楼层和车位，使用室内导航实时引导您走到你的车辆跟前，导航精度0.5米左右
- 【多位多车】
2. 智慧充电
3. 智慧社区
4. 电子支付
5. 用户资源
<template>
<view>
<view class="bgBox">
<view class="flex">
<image class="backIcon" src="../../static/images/jiantouLeft.png" mode="" @click="intoBack"></image>
<view class="navTitle">车场详情</view>
</view>
<view class="infoBox flex-col bb">
<view class="name">{{ changeInfo.stationName }}</view>
<view class="address flex">
<view class="single-line">{{ changeInfo.address }}</view>
</view>
<view class="spaces flex flex-row-between">
<view class="flex">
停车费：免费停车{{ (changeInfo.freeParkTime / 60000).toFixed(0) }}分钟
</view>
<view class="flex">
<image src="../../static/images/man@2x.png" mode="" style="width: 32rpx; height: 32rpx" />
<view style="margin-left: 8rpx">
{{
changeInfo.stationName == null ? '暂无数据' : changeInfo.usedSlowChargeNumber + '/' + changeInfo.slowChargeNumber
}}
</view>
<image src="../../static/images/kuai@2x.png" mode=""
style="width: 32rpx; height: 32rpx; margin-left: 14rpx" />
<view style="margin-left: 8rpx">
{{
changeInfo.stationName == null ? '暂无数据' : changeInfo.usedFastChargeNumber + '/' + changeInfo.fastChargeNumber
}}
</view>
</view>
</view>
<view class="price flex flex-col-center flex-row-between">
<view class="flex distance">
<image src="../../static/images/daohang@2x.png" mode="" style="width: 32rpx; height: 32rpx">
</image>
<view>距你{{(changeInfo.distance / 1000).toFixed(2)}}km</view>
</view>
</view>
<view class="line"></view>
<view class="flex flex-row-between" style="margin-top: 32rpx;">
<view class="flex-col flex-col-center" v-for="item in iconStatusArr" :key="item.icon">
<image :src="'../../static/images/' + item.icon + '.png'" mode=""
style="width: 48rpx;height: 48rpx;">
</image>
<view style="font-size: 22rpx;font-weight: 400;color: #323233;margin-top: 8rpx;">{{ item.name }}
</view>
</view>
</view>
</view>
</view>
<view class="imageBox">
<scroll-view :scroll-x="true" style="width: 100%;height: 100%;display: flex; white-space:nowrap;">
<image class="scrollViewImage" :src="item" v-for="item,index in changeInfo.newImageUrl" :key="item"
@click="previewImage(index)"></image>
</scroll-view>
</view>
<view class="feeBox bb">
<view class="name">忙闲情况</view>
<view class="flex flex-row-between" style="margin-top: 54rpx;">
<view class="flex-col flex-col-center">
<view class="changeStatusBox_text flex">
<view style="line-height: 42rpx;">闲</view>
<view style="font-size: 42rpx;color: #000;font-weight: 900;margin-left: 6rpx;">
{{changeInfo.usedFastChargeNumber}}
</view>
<view style="line-height: 42rpx;margin-left: 6rpx;">/{{changeInfo.fastChargeNumber}}</view>
</view>
<view class="changeStatusBox_red">快桩空闲</view>
</view>
<view class="flex-col flex-col-center">
<view class="changeStatusBox_text flex">
<view style="line-height: 42rpx;">闲</view>
<view style="font-size: 42rpx;color: #000;font-weight: 900;margin-left: 6rpx;">
{{changeInfo.usedSlowChargeNumber}}
</view>
<view style="line-height: 42rpx;margin-left: 6rpx;">/{{changeInfo.slowChargeNumber}}</view>
</view>
<view class="changeStatusBox_blue">慢桩空闲</view>
</view>
<view class="flex-col flex-col-center">
<view
style="line-height: 22rpx;font-size: 42rpx;color: #000;font-weight: 900;text-align: center;height: 66rpx;">
-
</view>
<view class="changeStatusBox_gray">即将充满</view>
</view>
</view>
</view>
<view class="feeBox bb">
<view class="name">充电费用</view>
<view class="feeBox_item1 bb flex flex-col-center">
<view style="margin-left: 32rpx;">
收费时段
</view>
<view style="margin-left: 156rpx;">充电费</view>
<view style="margin-left: 26rpx;">=</view>
<view style="margin-left: 34rpx;">电费</view>
<view style="margin-left: 50rpx;">服务费</view>
</view>
<view class="feeBox_item2 bb flex flex-col-center" v-for="item in rulesList" :key="item.id">
<view style="font-size: 24rpx;color: #434343;font-weight: 500;margin-left: 24rpx;">
{{ item.startTimeString + ' - ' + item.endTimeTimeString }}
</view>
<view
style="font-size: 24rpx;color: #434343;font-weight: 500;margin-left: 62rpx;width: 60rpx;text-align: center;">
{{item.fee + item.serviceFee}}
</view>
<view
style="font-size: 24rpx;color: #434343;font-weight: 500;margin-left: 72rpx;width: 60rpx;text-align: center;">
{{item.fee}}
</view>
<view
style="font-size: 24rpx;color: #434343;font-weight: 500;margin-left: 56rpx;width: 60rpx;text-align: center;">
{{item.serviceFee}}
</view>
</view>
</view>
<view class="feeBox bb" v-if="changeInfo.stationType !== 1">
<view class="name">停车费</view>
<view class="flex" style="margin-top: 40rpx;">
<view class="feeBoxItem1 bb">停车费</view>
<view class="feeBoxItem2 bb">免费停车 {{changeInfo.freeParkTime / 60000}} 分钟</view>
</view>
<view class="feeBoxText">该站点充电即可免费停车 {{changeInfo.freeParkTime / 60000}}分钟（充电启动前，请确认输入车牌是否准确）</view>
</view>
<uni-safe-area>
<view class="bottomBox bb flex flex-col-center flex-row-between">
<view class="left flex flex-col-center flex-row-center" @click="onNavigation">
<image src="../../static/images/feiji@2x.png" mode=""></image>
<view class="text">导航</view>
</view>
<view class="right flex flex-col-center flex-row-center" @click="onScanChange">
<image src="../../static/images/VIP@2x(3).png" mode=""></image>
<view class="text">开始充电</view>
</view>
</view>
</uni-safe-area>
</view>
</template>
<script>
import {
cfChargingStationGetInfoById,
getChargeRulesListByQuery
} from '../../network/api.js'
export default {
data() {
return {
iconStatusArr: [{
name: '充电桩',
icon: 'cdz@2x',
status: false
}, {
name: '便利店',
icon: 'bianlidian@2x',
status: false
}, {
name: '卫生间',
icon: 'wsj@2x',
status: false
}, {
name: '休息室',
icon: 'xxs@2x',
status: false
}, {
name: '雨棚',
icon: 'yupeng@2x',
status: false
}, {
name: '简餐',
icon: 'jz@2x',
status: false
}, {
name: '人工值守',
icon: 'rgzs@2x',
status: false
}],
chargeId: '',
changeInfo: {
name: '',
address: '',
freeTime: '',
parkingSpaceNumber: '',
usedParkingSpaceNumber: '',
distance: 0,
freeParkTime: 0,
usedFastChargeNumber: 0,
fastChargeNumber: 0,
usedSlowChargeNumber: 0,
slowChargeNumber: 0,
},
rulesList: [],
locationInfo: {
longitude: "",
latitude: "",
},
}
},
onLoad(e) {
this.chargeId = e.id
this.getLocation()
},
methods: {
getLocation() {
uni.getLocation({
type: "wgs84",
success: (res) => {
console.log("当前位置的经度：" + res.longitude);
console.log("当前位置的纬度：" + res.latitude);
this.locationInfo.longitude = res.longitude;
this.locationInfo.latitude = res.latitude;
this.fenchData()
this.fenchRulesData()
},
});
},
onScanChange() {
uni.showActionSheet({
itemList: ['扫码充电', '查看充电桩'],
success: ({
tapIndex
}) => {
if (tapIndex === 0) {
uni.scanCode({
success: (scanRes) => {
console.log(scanRes);
}
})
} else if (tapIndex === 1) {
if (this.changeInfo.stationType === 2) {
uni.navigateTo({
url: '/pages/chargeDetail/electricVehicleStart?chargeId=' + this
.chargeId
})
} else {
uni.navigateTo({
url: '/pages/chargeDetail/bicycleStart?chargeId=' + this
.chargeId
})
}
}
}
})
},
intoBack() {
uni.navigateBack()
},
onNavigation() {
uni.openLocation({
latitude: this.changeInfo.positionY,
longitude: this.changeInfo.positionX,
name: this.changeInfo.stationName,
address: this.changeInfo.address,
success: function() {
console.log('success');
}
});
},
async fenchRulesData() {
const {
data,
code,
message
} = await getChargeRulesListByQuery({
chargingStationId: this.chargeId,
page: 1,
size: 100
})
console.log(data, code);
if (code == 10002) {
this.rulesList = data
} else {
uni.showToast({
title: message,
icon: 'none'
})
}
},
async fenchData() {
const {
data,
code
} = await cfChargingStationGetInfoById({
id: this.chargeId,
positionX: this.locationInfo.longitude,
positionY: this.locationInfo.latitude,
})
console.log(data, code);
if (code == 10002) {
this.changeInfo = data
this.changeInfo.newImageUrl = this.changeInfo.imageUrl.split(',')
} else {
uni.showToast({
title: '获取停车场详情失败',
icon: 'none'
})
setTimeout(function() {
uni.navigateBack()
}, 1500);
}
},
previewImage(index) {
uni.previewImage({
current: index,
urls: this.changeInfo.newImageUrl
})
}
}
}
</script>
<style lang="scss">
page {
background: #F5F7FF;
padding-bottom: 200rpx;
}
.bottomBox {
width: 750rpx;
height: 165rpx;
background: #FFFFFF;
box-shadow: 0rpx -12rpx 14rpx 0rpx rgba(222, 220, 238, 0.5);
position: fixed;
left: 0;
bottom: 0;
padding: 0 32rpx;
overflow: hidden;
padding-bottom: 20rpx;
.left {
width: 332rpx;
height: 100rpx;
background: rgba(03, 148, 246, 0.18);
border-radius: 10rpx;
image {
width: 40rpx;
height: 40rpx;
}
.text {
height: 50rpx;
font-size: 36rpx;
font-weight: 600;
color: #6794F6;
line-height: 50rpx;
margin-left: 12rpx;
}
}
.right {
width: 332rpx;
height: 100rpx;
background: #6794F6;
border-radius: 10rpx;
image {
width: 40rpx;
height: 40rpx;
}
.text {
height: 50rpx;
font-size: 36rpx;
font-weight: 600;
color: #FFFFFF;
line-height: 50rpx;
margin-left: 12rpx;
}
}
}
.imageBox {
width: 686rpx;
height: 216rpx;
background: #FFFFFF;
border-radius: 10rpx;
margin-left: 32rpx;
}
.feeBox {
width: 686rpx;
background: #FFFFFF;
border-radius: 10rpx;
margin: 32rpx 0 0 32rpx;
padding: 32rpx;
.feeBox_item2 {
width: 622rpx;
height: 70rpx;
background: #F8F8F8;
border-radius: 8rpx;
margin-top: 28rpx;
// padding: 20rpx 24rpx;
}
.feeBox_item1 {
width: 622rpx;
height: 70rpx;
background: rgba(103, 148, 246, 0.1);
border-radius: 8rpx;
border: 2rpx solid #6794F6;
margin-top: 24rpx;
font-size: 24rpx;
color: #6794F6;
font-weight: 400;
// padding: 20rpx 24rpx 16rpx 24rpx;
}
.name {
height: 50rpx;
font-size: 36rpx;
font-weight: 600;
color: #323233;
line-height: 50rpx;
}
}
.scrollViewImage {
width: 262rpx;
height: 152rpx;
border-radius: 16rpx;
margin: 32rpx 0 0 32rpx;
display: inline-block;
}
.price {
margin-top: 24rpx;
.distance {
view:nth-child(2) {
height: 34rpx;
font-size: 24rpx;
font-weight: 400;
color: #434343;
line-height: 34rpx;
margin-left: 8rpx;
}
}
}
.changeStatusBox_text {
height: 66rpx;
font-size: 24rpx;
font-weight: 400;
color: rgba(50, 50, 51, 0.5);
line-height: 34rpx;
}
.changeStatusBox_red {
width: 120rpx;
height: 44rpx;
background: rgba(255, 158, 158, .34);
border-radius: 22rpx;
font-size: 22rpx;
font-weight: 600;
color: #FF7777;
line-height: 44rpx;
text-align: center;
}
.changeStatusBox_blue {
background: rgba(168, 179, 255, .34);
color: #8393FD;
@extend .changeStatusBox_red;
}
.changeStatusBox_gray {
background: rgba(190, 194, 223, .34);
color: #A1A3B1;
@extend .changeStatusBox_red;
}
.bgBox {
width: 750rpx;
height: 666rpx;
background: linear-gradient(360deg, #F5F7FF 0%, #A6C1FB 100%);
.backIcon {
width: 64rpx;
height: 64rpx;
margin: 100rpx 0 0 32rpx;
}
.navTitle {
width: 160rpx;
height: 56rpx;
font-size: 40rpx;
font-weight: 600;
color: #FFFFFF;
line-height: 56rpx;
margin: 100rpx 0 0 190rpx;
}
.infoBox {
width: 686rpx;
height: 415rpx;
background: #FFFFFF;
border-radius: 10rpx;
margin: 60rpx 0 0 32rpx;
padding: 32rpx;
.line {
width: 630rpx;
opacity: 0.43;
border: 2rpx dashed #979797;
margin: 42rpx 0 0 0;
}
.name {
height: 50rpx;
font-size: 36rpx;
font-weight: 600;
color: #323233;
line-height: 50rpx;
}
.address {
margin-top: 8rpx;
view:nth-child(1) {
width: 514rpx;
height: 32rpx;
font-size: 24rpx;
font-weight: 400;
color: #434343;
line-height: 34rpx;
}
}
.spaces {
height: 32rpx;
font-size: 24rpx;
font-weight: 400;
color: #323233;
line-height: 32rpx;
margin-top: 16rpx;
}
}
}
.feeBoxItem1 {
width: 92rpx;
height: 50rpx;
background: linear-gradient(138deg, #A0C6FB 0%, #6794F6 100%);
border-radius: 6rpx 0rpx 0rpx 6rpx;
font-size: 24rpx;
font-weight: 400;
color: #FFFFFF;
line-height: 50rpx;
text-align: center;
}
.feeBoxItem2 {
height: 50rpx;
border-radius: 0rpx 6rpx 6rpx 0;
border: 2rpx solid #6794F6;
font-size: 24rpx;
font-weight: 400;
color: #6D99F7;
line-height: 50rpx;
text-align: center;
padding: 0 16rpx;
}
.feeBoxText {
width: 622rpx;
height: 70rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #434343;
line-height: 34rpx;
margin-top: 24rpx;
}
</style>源码下载地址（后台管理开源地址）：停车场系统后台管理，新能源电动车充电系统，智慧社区物业人脸门禁后台管理: 城市智慧停车系统，汽车新能源充电，两轮电动车充电，物业缴费，社区到访记录，人脸门禁，上门报修等
3013
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
