6934 lines
174 KiB
Vue
6934 lines
174 KiB
Vue
<template>
|
||
<view class="page">
|
||
<!-- 自定义导航栏 -->
|
||
<view class="navBarBox">
|
||
<!-- 状态栏占位 -->
|
||
<view class="statusBar" :style="{ paddingTop:statusBarHeight+'px' }"></view>
|
||
<!-- 真正的导航栏内容 -->
|
||
<view class="navBar" :style="{ height:navBarHeight+'px' }">
|
||
<!-- <view>导航栏标题</view> -->
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uGUm5wKQAApGjgK8RIwK" mode="" @tap="topage(6)">
|
||
</image>
|
||
<view class="txts" v-if="gps.deptId==100">
|
||
|
||
|
||
</view>
|
||
<view class="txts" v-if="gps.deptId==101">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="" style="width: 100%;height: 20rpx;">
|
||
|
||
</view>
|
||
<view class="swiper_tips" @click="changetips" v-if="areaInfo.agreement&&!orderinfo.status">
|
||
<view class="cont">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/u1G7wy5BEuNOY8QVyZcF" mode=""></image>
|
||
<view class="scroll-container" ref="scrollContainer">
|
||
<text class="scroll-text" ref="scrollText"
|
||
:style="{ animation: `scroll-text ${duration}s linear infinite` }">{{ cleanedText() }}</text>
|
||
<text class="scroll-text" ref="scrollTextClone"
|
||
:style="{ animation: `scroll-text ${duration}s linear infinite` }">{{ cleanedText() }}</text>
|
||
<!-- Duplicate the text for seamless scrolling -->
|
||
</view>
|
||
</view>
|
||
<view class="iconfont icon-xiangyou1"></view>
|
||
</view>
|
||
<view class="order_tips" :class="{ collapsed: isCollapsed }" v-if="orderinfo.status" @click="starTime">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ukbZbyKgdFhB84ZAidyf" mode=""></image>
|
||
<view class="order_tips_txt" :class="{ collapsed: isCollapsed }">
|
||
您有正在骑行中的订单.....
|
||
</view>
|
||
<view class="iconfont icon-xiangyou1" v-if="!isCollapsed" @click="toggleOrderTips"></view>
|
||
<view class="iconfont icon-xiangzuo" v-if="isCollapsed" @click="toggleOrderTips"></view>
|
||
|
||
</view>
|
||
<view class="swiper_tips" style="background: rgba(255, 197, 197, 0.7);" v-if="netonlines==false">
|
||
<view class="cont">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uJ4bst6OYzPYD8iEtyCJ" mode=""></image>
|
||
<view class="scroll-container" ref="scrollContainer">
|
||
<text class="txt"
|
||
style="font-weight: 400;font-size: 28rpx;color: #444444;">当前网络不可用，请检查你的网络设置</text>
|
||
|
||
<!-- Duplicate the text for seamless scrolling -->
|
||
</view>
|
||
</view>
|
||
<!-- <view class="iconfont icon-xiangyou1" style="color: #444444;"></view> -->
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!-- <u-navbar :is-back="false" title="共享电动车" :border-bottom="false" :background="bgc" title-color='#2E4975'
|
||
title-size='36' height='36'></u-navbar> -->
|
||
<map class="map" id="map" ref="map" :scale="zoomSize" show-location v-if="showmap" :latitude="latitude"
|
||
:longitude="longitude" :show-location="true" :markers="markers" :polygons="polyline" :polyline="mappolyline"
|
||
@markertap="onMarkerTap" @tap="onMapTap" @regionchange="onMapRegionChange">
|
||
|
||
</map>
|
||
<view class="my-location" @click="setMapScale">
|
||
<image class="img" src="https://lxnapi.ccttiot.com/bike/img/static/uoxanRjBrBrtcYwRGXKa"></image>
|
||
</view>
|
||
<view class="park" @click="toggleIconAndCallout">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/u0I2B8G3YO7xUKtQKgio" mode=""></image>
|
||
</view>
|
||
<view class="botmbox2" v-if="showdevice">
|
||
<!-- <view class="close" @click="close()">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uBeBBKwQu2K2ZBdT7iN7" mode=""></image>
|
||
</view> -->
|
||
<view class="page1" v-if="deviceIndex==0">
|
||
<view class="top">
|
||
<view class="left">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uBPKgx3YNA8nYbFSTCGA" mode=""></image>
|
||
</view>
|
||
<view class="top_center">
|
||
<view class="cent_top">
|
||
车辆编号：{{deviceInfos.sn}}
|
||
</view>
|
||
<view class="cent_bot">
|
||
骑行前请检查车辆状态
|
||
</view>
|
||
</view>
|
||
<view class="top_right" @click="findBike()">
|
||
响铃寻车
|
||
</view>
|
||
</view>
|
||
<view class="center">
|
||
<view class="center_left">
|
||
<view class="center_left_top">
|
||
剩余骑行
|
||
</view>
|
||
<view class="center_left_bot" v-if="deviceInfos.remainingMileage">
|
||
{{deviceInfos.remainingMileage}}公里
|
||
</view>
|
||
<view class="center_left_bot" v-else>
|
||
--公里
|
||
</view>
|
||
</view>
|
||
<view class="center_right">
|
||
<view class="center_right_top">
|
||
预约费（10分钟）
|
||
</view>
|
||
<view class="center_right_bot">
|
||
{{areaInfo.appointmentServiceFee}} <span>元</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bot">
|
||
|
||
<view class=" left_btn" @click="Reserve()">
|
||
预约用车
|
||
</view>
|
||
<view class="right_btn" @click="lockDevice() ">
|
||
解锁用车
|
||
</view>
|
||
</view>
|
||
<view class="tips" @click="topage(7)">
|
||
发现坏车 >
|
||
</view>
|
||
</view>
|
||
<view class="page2" v-if="deviceIndex==1">
|
||
<view class="top">
|
||
<!-- <view class="left">
|
||
<view class="text">
|
||
可行驶53公里
|
||
</view>
|
||
<view class="ele">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/upbpFLv4dkl88Syk2VKW" mode=""></image>
|
||
电量充足
|
||
</view>
|
||
</view> -->
|
||
<view class="right">
|
||
<view class="text">
|
||
剩余骑行
|
||
</view>
|
||
<!-- <view class="txt">
|
||
{{deviceInfos.remainingMileage}}<span style="font-size: 40rpx;">公里</span>
|
||
</view> -->
|
||
<view class="txt" v-if="deviceInfos.remainingMileage">
|
||
{{deviceInfos.remainingMileage}}<span style="font-size: 40rpx;">公里</span>
|
||
</view>
|
||
<view class="txt" v-else>
|
||
--<span style="font-size: 40rpx;">公里</span>
|
||
</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="text">
|
||
剩余电量
|
||
</view>
|
||
<view class="txt" style="font-size: 36rpx;" v-if="deviceInfos.remainingPower">
|
||
{{ deviceInfos.remainingPower}}%
|
||
<!-- {{startingPrice}}<span style="font-size: 40rpx;">元</span> -->
|
||
</view>
|
||
<view class="txt" style="font-size: 36rpx;" v-else>
|
||
--
|
||
<!-- {{startingPrice}}<span style="font-size: 40rpx;">元</span> -->
|
||
</view>
|
||
<view class="speed">
|
||
<view class="speeds" :style="{ width: deviceInfos.remainingPower + '%' }">
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="center">
|
||
<view class="tips" v-if="freList.length<1" style="width: 100%;height: 200rpx;font-size: 40rpx;color: #ccc;text-align: center;padding-top: 80rpx;">
|
||
运营商未设置收费方式，无法使用
|
||
</view>
|
||
<view class="card" v-for="(item,index ) in freList" :key="index"
|
||
@click.stop="changefree(item,index+1)" :class="freeListIndex==index+1?'act1':''">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uPtfF3jVLMVvEYpilzTk" mode=""
|
||
v-if="freeListIndex==index+1"></image>
|
||
<view v-if="item.ridingRule==1">
|
||
<view class="tit">
|
||
{{item.name}}
|
||
</view>
|
||
<view style="padding: 18rpx;">
|
||
<view class="nmtxt">
|
||
<view class="left">
|
||
起步价
|
||
</view>
|
||
<view class="right">
|
||
{{item.ridingRuleJson.startingPrice}}元(含{{item.ridingRuleJson.startingTime}}<span
|
||
v-if="item.rentalUnit=='minutes'">分钟</span><span
|
||
v-if="item.rentalUnit=='hours'">小时</span><span
|
||
v-if="item.rentalUnit=='day'">天</span>)
|
||
</view>
|
||
</view>
|
||
<view class="nmtxt">
|
||
<view class="left">
|
||
超出费
|
||
</view>
|
||
<view class="right">
|
||
{{item.ridingRuleJson.timeoutPrice}}元/{{ item.ridingRuleJson.timeoutTime}}<span
|
||
v-if="item.rentalUnit=='minutes'">分钟</span><span
|
||
v-if="item.rentalUnit=='hours'">小时</span><span
|
||
v-if="item.rentalUnit=='day'">天</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="tips" @click.stop='feedetail(item,index+1)'>
|
||
查看详情 <view class="iconfont icon-chakanxiangqing"></view>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view v-if="item.ridingRule==2">
|
||
<view class="tit">
|
||
{{item.name}}
|
||
|
||
</view>
|
||
<view style="padding: 18rpx;">
|
||
<view class="nmtxt text-ellipsis" v-for="(items, indexs) in item.ridingRuleJson.rule"
|
||
:key="indexs" style="margin-top: 10rpx;" v-if="indexs<2">
|
||
|
||
<view class="left " style="font-size: 28rpx;">
|
||
{{items.start}}-{{items.end}}<span v-if="item.rentalUnit=='minutes'">分钟</span>
|
||
<span v-if="item.rentalUnit=='hours'">小时</span>
|
||
<span v-if="item.rentalUnit=='day'">天</span>,
|
||
每{{items.eachUnit}}<span v-if="item.rentalUnit=='minutes'">分钟</span>
|
||
<span v-if="item.rentalUnit=='hours'">小时</span>
|
||
<span v-if="item.rentalUnit=='day'">天</span>/{{items.fee}}元
|
||
<span v-if="indexs==1">...</span>
|
||
</view>
|
||
<view class="right"></view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
|
||
|
||
</view>
|
||
<view class="tips_btn" @click.stop='feedetail(item,index+1)'>
|
||
查看详情
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bot" style="margin-top: 20rpx;">
|
||
<view class="xy" @click="showxy=!showxy">
|
||
<view class="yuans">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/u7F851ikY9rkASzNSNkO" v-if='showxy'
|
||
mode=""></image>
|
||
</view>
|
||
|
||
<view class="txt">
|
||
我已同意并阅读 <span @click.stop="toxy()">《电动车租赁协议》</span>
|
||
</view>
|
||
</view>
|
||
<view class="btn" @click="taploadmask(1)" v-if="type==1&&freList.length>1">
|
||
确认开锁
|
||
</view>
|
||
<view class="btn" v-if="type==1&&freList.length<1" style="background-color: #ccc;color: #fff;">
|
||
确认开锁
|
||
</view>
|
||
<view class="btn" @click="sub3()" v-if="type==2">
|
||
确认预约
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="page3" v-if="deviceIndex==2">
|
||
<view class="bot_btns">
|
||
|
||
<view class="infoss">
|
||
<view class="left">
|
||
预估金额：{{ parseFloat(money).toFixed(2) }}<span>元</span>
|
||
</view>
|
||
<!-- <view style="width: 10rpx;" v-if="orderinfo.ruleId!=null">
|
||
|
||
</view> -->
|
||
<view class="right">
|
||
{{timeString}}
|
||
</view>
|
||
</view>
|
||
<view class="cardss">
|
||
<view class="tit">
|
||
电单车
|
||
</view>
|
||
<view class="cont">
|
||
<view class="left">
|
||
<view class="text" v-if="orderinfo.sn!='' ">
|
||
可继续行驶{{OrderdeviceInfos.remainingMileage}}公里
|
||
</view>
|
||
<view class="speed" style="background: #ccc; ">
|
||
<view class="speeds" :style="{ width: OrderdeviceInfos.remainingPower + '%' }">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="mac" v-if="orderinfo.sn ">
|
||
NO.{{orderinfo.sn}}
|
||
</view>
|
||
<view class="mac" v-if="!orderinfo.sn " style="color: red;">
|
||
换车开锁失败，请点击换车按钮重新换车
|
||
</view>
|
||
</view>
|
||
<view class="right">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uHTCZOVUbmBkKW4G0wuF" mode="">
|
||
</image>
|
||
</view>
|
||
|
||
</view>
|
||
<!-- <view class="changebiketip" @click="tochange()">
|
||
换车骑行 <view class="iconfont icon-xiangyou1">
|
||
|
||
</view>
|
||
</view> -->
|
||
</view>
|
||
<view class="bot" style="margin-top: 20rpx;" v-if="orderinfo.status==0">
|
||
<view class="btn" style=" margin-right: 16rpx;" @click="unlockdevice()">
|
||
解锁骑行
|
||
</view>
|
||
<view class="btn1" @click="cancel()" v-if="orderinfo.ruleId==null">
|
||
取消预约
|
||
</view>
|
||
<view class="btn1" @click="cancel1()" v-if="orderinfo.ruleId!=null">
|
||
取消预约
|
||
</view>
|
||
</view>
|
||
<view class="bot" style="margin-top: 20rpx;" v-if="orderinfo.status==2">
|
||
<view class="changebiketip" @click="tochange()">
|
||
换车骑行 <view class="iconfont icon-xiangyou1">
|
||
</view>
|
||
</view>
|
||
<view class="btn" style=" margin-right: 16rpx;"
|
||
v-if="orderinfo.sn && (OrderdeviceInfos.status == 3 || OrderdeviceInfos.status == 6)"
|
||
@click="taploadmask (2)">
|
||
临时锁车
|
||
</view>
|
||
<view class="btn" style=" margin-right: 16rpx;" v-if="OrderdeviceInfos.status==4"
|
||
@click=" taploadmask(3)">
|
||
解锁用车
|
||
</view>
|
||
<view class="btn" style=" margin-right: 16rpx;" @click="tochange()" v-if="!orderinfo.sn">
|
||
继续换车
|
||
</view>
|
||
<view class="btn1" @click=" taploadmask(4)" v-if="orderinfo.sn">
|
||
还车
|
||
</view>
|
||
<view class="btn1" @click=" taploadmask(4)" v-if="!orderinfo.sn">
|
||
结束订单
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<view class="page4" v-if="deviceIndex==3">
|
||
<view class="bot_btn">
|
||
<view class="time">
|
||
使用时间：{{timeString}}
|
||
</view>
|
||
<view class="price">
|
||
{{orderinfo.totalFee}}<span>元</span>
|
||
</view>
|
||
<view class="toinfo" @click="tofeeDetail()">
|
||
查看骑行费明细 >
|
||
</view>
|
||
<view class="btn" @click="topay()" v-if="orderinfo.status==1">
|
||
去支付
|
||
</view>
|
||
<view class="btn" @click="topay1()" v-if="orderinfo.status==3">
|
||
去支付
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="botmbox" v-if="showindex==0&&showdevice==false">
|
||
<view class="top_btn" @tap="qecodelock()">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/un6Wi8CefEjy04qzvn67" mode=""></image>
|
||
扫码开锁
|
||
</view>
|
||
|
||
<view class="bot_btn">
|
||
<view class="cont" @click="topage(1)" v-if="areaInfo.deposit!=0">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uYfTj4a3NkSNY0AqYHFc" mode=""></image>
|
||
<view class="text">
|
||
押金充值
|
||
</view>
|
||
</view>
|
||
<!-- <view class="cont" @click="topage(2)">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uFHC2R6R3pgUOTShLxoQ" mode=""
|
||
style="width: 28rpx;height: 28rpx;"></image>
|
||
<view class="text">
|
||
计费规则
|
||
</view>
|
||
</view> -->
|
||
<view class="cont" @click="topage(3)">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ucR0pDCg1vDshatphlUb" mode=""></image>
|
||
<view class="text">
|
||
用车指南
|
||
</view>
|
||
</view>
|
||
<view class="cont" @click="topage(4)">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugCygoi3DXNWTLbC9vJ4" mode=""></image>
|
||
<view class="text">
|
||
编号开锁
|
||
</view>
|
||
</view>
|
||
<view class="cont" @click="topage(5)">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uiUTdm3iNOnfP17OCLHu" mode=""></image>
|
||
<view class="text">
|
||
故障上报
|
||
</view>
|
||
</view>
|
||
<view class="cont" @click="topage(9)">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uLHRXFuIPhMy0EDgPdVr" mode=""></image>
|
||
<view class="text">
|
||
客户服务
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="guangggao" v-if="gps.deptId==100">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/upVZa2QXC27BG90PukMQ" mode=""></image>
|
||
</view>
|
||
<view class="guangggao" v-if="gps.deptId==101" @click="gotowzysd()">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ut77aiicZLtFL5gnRplK" mode=""></image>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- <view class="tipss_box">
|
||
<view class="tipss" v-if="orderinfo.status" @click="starTime">
|
||
您有正在进行中的订单 <view class="iconfont icon-xiangyou1" style="margin-left: 20rpx;">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="" v-if="!orderinfo.status" style="background: none;width: 350rpx;
|
||
height: 64rpx;">
|
||
|
||
</view>
|
||
<swiper class="swiper" circular :autoplay="autoplay" :interval="interval" :duration="duration">
|
||
|
||
<swiper-item>
|
||
<view class="tipss">
|
||
点击车辆可以预约用车
|
||
</view>
|
||
</swiper-item>
|
||
<swiper-item>
|
||
<view class="tipss" @click="changetips">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uJnO5qX8ggJvL1Nf7PQt" mode=""></image>
|
||
文明骑行,须知
|
||
<view class="iconfont icon-xiangyou1">
|
||
|
||
</view>
|
||
</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
|
||
|
||
|
||
|
||
</view> -->
|
||
<view class="bottom_more" v-if="showindex==1">
|
||
<view class="close" @click="showindex=0">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uM76uO46a5cZOkFlffnX" mode=""></image>
|
||
</view>
|
||
<div class="tit">
|
||
更多用车服务
|
||
</div>
|
||
<div class="contbox" style="width: 100%;">
|
||
<view class="cont_li" @click="topage(1)">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uGDkCwxDNH9oFORX2XNU" mode=""></image>
|
||
<view class="txt">
|
||
押金充值
|
||
</view>
|
||
</view>
|
||
|
||
<view class="cont_li" @click="topage(3)">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/utP4rdOzXLlQPx6Ug8cO" mode=""></image>
|
||
<view class="txt">
|
||
用车指南
|
||
</view>
|
||
</view>
|
||
<view class="cont_li" @click="topage(4)">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uFaJV6NJGhmmodpEuWMy" mode=""></image>
|
||
<view class="txt">
|
||
编号开锁
|
||
</view>
|
||
</view>
|
||
|
||
<view class="cont_li" @click="topage(5)">
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/uucc9g8b2MM6G9vp8HWa" mode=""></image>
|
||
<view class="txt">
|
||
故障上报
|
||
</view>
|
||
</view>
|
||
<view class="cont_li" @click="topage(6)">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uW1XRPQfJTD6sLimkln5" mode=""></image>
|
||
<view class="txt">
|
||
个人中心
|
||
</view>
|
||
</view>
|
||
</div>
|
||
</view>
|
||
<u-mask :show="showtcs" @click="showtc = false" :z-index='100' duration='0' />
|
||
<u-mask :show="showTips" :z-index='100' duration='0' />
|
||
|
||
<!-- <u-mask :show="showYjTip" @click="showYjTip = false" :z-index='100' duration='0' />
|
||
|
||
<view class="pops" v-if="showYjTip">
|
||
<view class="tit" style="font-weight: 600;">
|
||
您未充值押金
|
||
</view>
|
||
<view class="cont_box" style="text-align: center;color: #808080;justify-content: center;font-size: 36rpx;">
|
||
请在充值押金后使用共享电动车
|
||
</view>
|
||
|
||
<view class="btn_box">
|
||
<view class="btn1" @click="showYjTip = false">
|
||
取消
|
||
</view>
|
||
<view class="btn2" @click="topage(1)">
|
||
前往充值
|
||
</view>
|
||
</view>
|
||
|
||
</view> -->
|
||
<view class="pops" v-if="showtcs">
|
||
<view class="tit" style="font-weight: 600;">
|
||
您有正在进行的订单
|
||
</view>
|
||
<view class="cont_box">
|
||
<view class="left">
|
||
电单车
|
||
</view>
|
||
<view class="right">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="cont_box">
|
||
<view class="left">
|
||
<view class="km">
|
||
可继续行驶{{OrderdeviceInfos.remainingMileage}}公里
|
||
</view>
|
||
<view class="speed">
|
||
<view class="speeds" :style="{ width: OrderdeviceInfos.remainingPower + '%' }">
|
||
|
||
</view>
|
||
</view>
|
||
<view class="NO">
|
||
NO.{{OrderdeviceInfos.sn}}
|
||
</view>
|
||
</view>
|
||
<view class="right">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uqKmFMF9YHTX8lAQARSd" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="cont_box">
|
||
<view class="left">
|
||
已骑行
|
||
</view>
|
||
<view class="right">
|
||
{{timeString}}
|
||
</view>
|
||
</view>
|
||
<view class="cont_box">
|
||
<view class="left">
|
||
预估金额
|
||
</view>
|
||
<view class="right">
|
||
{{money}}元
|
||
</view>
|
||
</view>
|
||
<view class="btn" @click=" starTime" style="margin-bottom: 50rpx;">
|
||
点击查看
|
||
|
||
</view>
|
||
<view class="close" @click="showtcs = false">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uyPRLCHBTUeN7UHzDEGR" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<view class="pops" v-if="showTips">
|
||
<view class="tit" style="font-weight: 700;">
|
||
安全骑行 禁止超载
|
||
</view>
|
||
<view class="cont" v-html="areaInfo.agreement" style="padding: 0 20rpx;line-height: 48rpx;">
|
||
|
||
</view>
|
||
|
||
<view class="btn" @click="changetips()" :class="countdown>0? 'act1':''">
|
||
我已阅读同意 <span v-if='countdown>0' style="margin-left: 10rpx;">({{countdown}})</span>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!-- 蓝牙 -->
|
||
<u-mask :show="isnoline" :z-index='100' duration='0' />
|
||
<view class="pops" v-if="isnoline">
|
||
<view class="tit" style="font-weight: 600;">
|
||
设备异常离线
|
||
</view>
|
||
<view class="cont_box" style="text-align: center;color: #808080;justify-content: center;font-size: 36rpx;">
|
||
请使用蓝牙连接辅助操作,请确保手机蓝牙权限已授权
|
||
</view>
|
||
|
||
<view class="btn_box">
|
||
<view class="btn1" @click="isnoline = false">
|
||
取消
|
||
</view>
|
||
<view class="btn2" @click="Binddevice()">
|
||
蓝牙连接
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<!-- 是否在运营区 -->
|
||
<u-mask :show="isbackdevice" :z-index='100' duration='0' />
|
||
<view class="pops" v-if="isbackdevice">
|
||
<view class="tit" style="font-weight: 600;">
|
||
停车点外还车
|
||
</view>
|
||
<view class="cont_box" style="text-align: center;color: #808080;justify-content: center;font-size: 36rpx;">
|
||
未在停车点内还车,任要还车会产生额外费用，是否继续还车？
|
||
</view>
|
||
|
||
<view class="btn_box">
|
||
<view class="btn1" @click="isbackdevice = false">
|
||
取消
|
||
</view>
|
||
<view class="btn2" @click="keepback()">
|
||
确定
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<!-- 是否确认还车 -->
|
||
<u-mask :show="isbackcar" :z-index='100' duration='0' />
|
||
<view class="pops" @click="isbackcar = false" v-if="isbackcar">
|
||
<view class="tit" style="font-weight: 600;">
|
||
温馨提示
|
||
</view>
|
||
<view class="cont_box" style="text-align: center;color: #808080;justify-content: center;font-size: 36rpx;">
|
||
为了避免误触，请问是否确定还车
|
||
</view>
|
||
|
||
<view class="btn_box">
|
||
<view class="btn1" @click="isbackcar = false">
|
||
取消
|
||
</view>
|
||
<view class="btn2" @click="backDevice()">
|
||
确定
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<u-mask :show="loadingmask" :z-index='100' duration='0' />
|
||
<view class="pops" v-if="loadingmask" style="width: 500rpx;left:124rpx">
|
||
<view class="tit" style="font-weight: 600;">
|
||
{{loadingtxt}}
|
||
</view>
|
||
<!-- <u-loading size="50" mode="flower"></u-loading> -->
|
||
<view class="loading_box">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uOQxwzp0Sj9l2WZ534zp" mode=""></image>
|
||
<!-- <view class="loader">
|
||
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<u-mask :show="maskloading" :z-index='100' duration='0' />
|
||
<view class="maskload" v-if="maskloading">
|
||
<view class="maskpage0" v-if="maskepage==0">
|
||
<view class="top_info">
|
||
<image :src="loadimg" mode=""></image>
|
||
<view class="masktxt">
|
||
{{toploadtxt}}
|
||
</view>
|
||
</view>
|
||
<view class="masktips">
|
||
{{tiptxt}}
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
</view>
|
||
<!-- 不允许停车点外还车 -->
|
||
<view class="maskpage1" v-if="maskepage==1" style="display: flex; justify-content: center;flex-wrap: wrap;">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ufkol3nMNJw4v1kHLFcH" mode=""></image>
|
||
<view class="masktxt">
|
||
不在停车点
|
||
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 70%;">
|
||
无法在停车点外继续还车，请行驶至附近停车点
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uSntjowDWwILqVzdCj5L" mode=""
|
||
style="height: 290rpx;"></image>
|
||
</view>
|
||
<view class="btn_box" style="justify-content: center;">
|
||
<view class="btn3" @click="closemaske() " style="width: 600rpx;">
|
||
继续用车
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<!-- 允许停车点外还车 -->
|
||
<view class="maskpage1" v-if="maskepage==2">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ufkol3nMNJw4v1kHLFcH" mode=""></image>
|
||
<view class="masktxt">
|
||
不在停车点
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;">
|
||
未在停车点需支付管理费： <span
|
||
style="color: coral;font-size: 42rpx;font-weight: 600;">{{areaInfo.vehicleManagementFee}}</span>元
|
||
<!-- ，你可查看最近 停车点 -->
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uSntjowDWwILqVzdCj5L" mode=""
|
||
style="height: 290rpx;"></image>
|
||
</view>
|
||
<view class="btn_box">
|
||
<view class="btn4" @click="maskloading=false">
|
||
继续用车
|
||
</view>
|
||
<view class="btn3" @click="payback()">
|
||
继续还车
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 提示设备离线 使用蓝牙连接 -->
|
||
<view class="maskpage1" v-if="maskepage==3">
|
||
<view class="top_info">
|
||
<image :src="loadimg" mode=""></image>
|
||
<view class="masktxt">
|
||
设备离线无法解锁
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;">
|
||
需连接蓝牙才可解锁,请确保手机蓝牙打开并且授权小程序使用蓝牙权限
|
||
</view>
|
||
<view class="masktips" @click="totxtpage()"
|
||
style="width: 100%;color: #64B6A8;text-decoration-line: underline;margin-top: 0; font-size: 28rpx;">
|
||
点击查看教程
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<view class="btn_box">
|
||
|
||
<view class="btn4" @click="maskloading=false">
|
||
换车解锁
|
||
|
||
</view>
|
||
<view class="btn3" @click="offopencar()">
|
||
连接蓝牙
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="maskpage1" v-if="maskepage==4">
|
||
<view class="top_info">
|
||
<image :src="loadimg" mode=""></image>
|
||
<view class="masktxt">
|
||
{{buletxt}}
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;">
|
||
请确保与车辆的距离小于3米
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<!-- <view class="btn_box">
|
||
|
||
<view class="btn4" @click="maskloading=false">
|
||
继续用车
|
||
|
||
</view>
|
||
<view class="btn3" @click="Binddevice">
|
||
连接蓝牙
|
||
</view>
|
||
</view> -->
|
||
</view>
|
||
<view class="maskpage1" v-if="maskepage==5">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uG3cbPgvPDzwlq6IHHxK" mode=""></image>
|
||
<view class="masktxt" v-if="orderinfo.sn">
|
||
蓝牙连接失败
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;">
|
||
请确保手机蓝牙已经打开
|
||
</view>
|
||
<view class="masktips" @click="totxtpage()"
|
||
style="width: 100%;color: #64B6A8;text-decoration-line: underline;margin-top: 0; font-size: 28rpx;">
|
||
点击查看教程
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<view class="btn_box">
|
||
|
||
<view class="btn4" @click="maskloading=false" v-if="orderinfo.sn">
|
||
继续用车
|
||
|
||
</view>
|
||
<view class="btn4" @click="maskloading=false" v-else>
|
||
返回
|
||
|
||
</view>
|
||
<view class="btn3" @click="tryagain() ">
|
||
重新尝试
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="maskpage1" v-if="maskepage==6">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uG3cbPgvPDzwlq6IHHxK" mode=""></image>
|
||
<view class="masktxt">
|
||
您还未充值押金
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;">
|
||
需充值押金后方可骑行
|
||
</view>
|
||
<view class="tipsimg">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<view class="btn_box">
|
||
|
||
<view class="btn4" @click="maskloading=false">
|
||
取消
|
||
|
||
</view>
|
||
<view class="btn3" @click="topage(1)">
|
||
押金充值
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="maskpage1" v-if="maskepage==7">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uvAGhjbhjhSaxCru8dSN" mode=""
|
||
style="width: 25rpx;"></image>
|
||
<view class="masktxt">
|
||
设备电量过低
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;margin-top: 45rpx;">
|
||
请使用附近其他车辆
|
||
</view>
|
||
<view class="tipsimg" style="margin-top: 90rpx;">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<view class="btn_box" style="justify-content: center;">
|
||
|
||
<view class="btn3" @click="maskloading=false" style="width: 600rpx;">
|
||
换车解锁
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="maskpage1" v-if="maskepage==8">
|
||
<view class="top_info">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uG3cbPgvPDzwlq6IHHxK" mode=""></image>
|
||
<view class="masktxt">
|
||
还车提示
|
||
</view>
|
||
</view>
|
||
<view class="masktips" style="width: 100%;margin-top: 45rpx;">
|
||
还车前需前往拍照确保车辆是否完好，
|
||
</view>
|
||
<view class="masktips" style="width: 100%;margin-top: 10rpx;">
|
||
还车成功且审核通过 将退还押金
|
||
</view>
|
||
<view class="tipsimg" style="margin-top: 90rpx;">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/ugvqmfB3QYujZ6SnfTia" mode=""></image>
|
||
</view>
|
||
<view class="btn_box">
|
||
|
||
<view class="btn4" @click="maskloading=false">
|
||
返回
|
||
|
||
</view>
|
||
<view class="btn3" @click="tovadio()">
|
||
去拍照
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bottom_park" v-if="showparkinfo">
|
||
<view class="tit">
|
||
{{parkinfo.parkingName}}
|
||
</view>
|
||
<view class="tip">
|
||
请根据手机引导将车辆有序停入停车点
|
||
</view>
|
||
<image class="close" src="https://lxnapi.ccttiot.com/bike/img/static/uVLkXSwvcYGioehd7dxn" mode=""
|
||
@click="showparkinfo=false"></image>
|
||
<image class="parkimg" :src="parkinfo.picture" mode="" v-if="parkinfo.picture!=null"></image>
|
||
<view class="gobtn" @click="mapFun(parkinfo.latitude,parkinfo.longitude,parkinfo.parkingName)">
|
||
导航去这里
|
||
</view>
|
||
</view>
|
||
<view class="fixdivce" v-if="showdevice&&false">
|
||
<view class="scrollable-content">
|
||
<view class="divce_li" v-for="(item,index) in nearbyMarkers" :key="index" @click="tapsn(item.sn)">
|
||
<view class="left_img">
|
||
<image src="https://lxnapi.ccttiot.com/bike/img/static/uEW2Zm3sO8E5eqOf2wwl" mode=""></image>
|
||
</view>
|
||
<view class="right_cont">
|
||
<view class="right_top">
|
||
<view class="right_top_left">
|
||
<image src=" https://lxnapi.ccttiot.com/bike/img/static/u9pggdTCxcZgUTNsEvXQ" mode="">
|
||
</image>
|
||
{{item.remainingPower}}%
|
||
</view>
|
||
<view class="right_top_right">
|
||
可行驶{{item.remainingMileage}}km
|
||
</view>
|
||
</view>
|
||
<view class="right_bot">
|
||
SN:{{item.sn}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
const app = getApp();
|
||
var xBlufi = require("@/utils/blufi/xBlufi.js");
|
||
let _this = null;
|
||
import QQMapWX from '@/common/qqmap-wx-jssdk.min.js'
|
||
var qqmapsdk
|
||
export default {
|
||
data() {
|
||
return {
|
||
|
||
bgc: {
|
||
backgroundColor: "#F7FAFE",
|
||
},
|
||
showIconAndCallout: false, // 控制是否显示iconPath和callout
|
||
showindex: 0,
|
||
show: false,
|
||
latitude: '',
|
||
longitude: '',
|
||
isMap: false,
|
||
zoomSize: 16,
|
||
markers: [],
|
||
polyline: [],
|
||
areas: [],
|
||
gps: {
|
||
deptId: 100
|
||
},
|
||
deviceInfos: {},
|
||
OrderdeviceInfos: {},
|
||
showdevice: false,
|
||
deviceIndex: 0,
|
||
type: 0,
|
||
freList: [],
|
||
freeListIndex: 0,
|
||
freeInfo: {},
|
||
socket: null,
|
||
sn: 0,
|
||
eventKey: 0,
|
||
orderinfo: {},
|
||
timer: null,
|
||
timeString: '',
|
||
money: 0,
|
||
showtc: false,
|
||
showtcs: false,
|
||
areaInfo: {},
|
||
// feeInfo:{},
|
||
showfeeDetail: false,
|
||
seeDetail: false,
|
||
showmap: true,
|
||
userinfo: {},
|
||
parkingList: [],
|
||
timers: null,
|
||
listData: [],
|
||
oldMarkers: [],
|
||
curtitidx: 0,
|
||
swiperHeight: 50,
|
||
|
||
indicatorDots: true,
|
||
autoplay: true,
|
||
interval: 2000,
|
||
duration: 500,
|
||
showTips: false,
|
||
showYjTip: false,
|
||
showxy: false,
|
||
countdown: 5, // 五秒倒计时
|
||
// userId:this.$store.getters.userId,
|
||
qParam: null,
|
||
|
||
|
||
// 蓝牙
|
||
devicesList: [
|
||
// {name:'110000',
|
||
// mac:'11111'}
|
||
],
|
||
searching: false,
|
||
texts: '正在扫描蓝牙设备...',
|
||
btnflag: true,
|
||
tishiflag: false,
|
||
option: '',
|
||
bluthlist: [], //蓝牙数组
|
||
// status: 'loading',
|
||
statusflag: false,
|
||
Bluetoothmac: '',
|
||
mac: '',
|
||
ishave: false,
|
||
ver_data: null,
|
||
deviceInfoss: {},
|
||
|
||
|
||
deviceIds: '',
|
||
name: '',
|
||
orderinfo: {},
|
||
dl: 0,
|
||
czmoney: true,
|
||
iscz: true,
|
||
isnoline: false,
|
||
carstause: false,
|
||
|
||
isbackdevice: false,
|
||
isbackcar: false,
|
||
loadingmask: false,
|
||
loadingtxt: '设备连接中...',
|
||
|
||
maskloading: false,
|
||
toploadtxt: "开锁中0%",
|
||
loadimg: 'https://lxnapi.ccttiot.com/bike/img/static/uRxPPoVoqmnmng6wKlij',
|
||
tiptxt: '请定点停放，规范用车',
|
||
maskepage: 0,
|
||
backgps: {},
|
||
buletxt: '',
|
||
|
||
buleclose: false,
|
||
buleopen: false,
|
||
buleback: false,
|
||
bulepayback: false,
|
||
bulebindcar: false,
|
||
|
||
|
||
backfalse: 0,
|
||
statusBarHeight: 0,
|
||
// 导航栏高度
|
||
navBarHeight: 0,
|
||
|
||
mappolyline: [],
|
||
qqmapsdk: null,
|
||
index: 0,
|
||
|
||
lastClickedMarkerId: null, // To store the ID of the last clicked marker
|
||
defaultMarkerIconPath: 'https://api.ccttiot.com/smartmeter/img/static/uF9qLejuAZErNTrRuHq7',
|
||
clickedMarkerIconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uf2TwgtQ2sKJrUY3wTz4',
|
||
ispaid: false,
|
||
isInParkingArea: null,
|
||
specificDeviceMarkerId: null,
|
||
|
||
nearbyMarkers: [],
|
||
duration: 0,
|
||
showordertxt: true,
|
||
orderwidth: 688,
|
||
|
||
isCollapsed: false,
|
||
isupload: false,
|
||
showparkinfo: false,
|
||
parkinfo: {},
|
||
netonlines: false,
|
||
isqrcode: false,
|
||
deviceGps: {
|
||
|
||
},
|
||
tozf:false
|
||
}
|
||
},
|
||
watch: {
|
||
userId(newValue, oldValue) {
|
||
// 处理userId变化的逻辑
|
||
// console.log('userId 发生变化', newValue, oldValue);
|
||
this.getisInOrder()
|
||
},
|
||
cleanedText() {
|
||
this.$nextTick(() => {
|
||
this.initScroll();
|
||
});
|
||
},
|
||
showdevice(newValue, oldValue) {
|
||
console.log('showdevice变化了', newValue, oldValue);
|
||
},
|
||
tozf(newValue, oldValue) {
|
||
console.log('tozf变化了', newValue, oldValue);
|
||
},
|
||
|
||
},
|
||
|
||
onLoad(e) {
|
||
//获取手机状态栏高度
|
||
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
|
||
|
||
// #ifdef MP-WEIXIN
|
||
// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
|
||
const custom = wx.getMenuButtonBoundingClientRect()
|
||
|
||
|
||
// 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
|
||
this.navBarHeight = custom.height + (custom.top - this.statusBarHeight) * 2
|
||
|
||
|
||
// #endif
|
||
|
||
|
||
qqmapsdk = new QQMapWX({
|
||
key: 'E7OBZ-KRKWW-5VKRH-36XXR-TB3NS-MUFHB' // 自己申请的key值
|
||
});
|
||
|
||
this.gps.deptId = uni.getStorageSync('deptId');
|
||
|
||
if (e.q) {
|
||
this.qParam = e.q
|
||
|
||
|
||
}
|
||
console.log(e,'e.qParame.qParam');
|
||
if (e.qParam) {
|
||
this.qParam = e.qParam
|
||
|
||
|
||
}
|
||
if (e.isupload) {
|
||
this.isupload = true
|
||
setTimeout(() => {
|
||
this.taploadmask(4)
|
||
}, 1000)
|
||
}
|
||
if (this.gps.deptId == 101) {
|
||
if (this.showagre) {
|
||
uni.redirectTo({
|
||
url: '/page_user/agreement?needback=true&qParam=' + this.qParam
|
||
})
|
||
}
|
||
}
|
||
|
||
if (e.sn) {
|
||
this.sn = e.sn
|
||
if (this.sn != '') {
|
||
setTimeout(() => {
|
||
if (!this.orderinfo.status) {
|
||
this.deviceInfo(1)
|
||
// this.showdevice = true
|
||
// this.deviceIndex = 1
|
||
// this.type = 1
|
||
}
|
||
}, 500)
|
||
|
||
|
||
}
|
||
|
||
}
|
||
// setTimeout(() => {
|
||
// this.$store.commit('SET_SHOWTIPS', true);
|
||
// }, 500)
|
||
},
|
||
onShow() {
|
||
this.timestare()
|
||
this.backfalse = 0
|
||
this.carstause = false
|
||
// 检查蓝牙权限状态
|
||
uni.getBluetoothAdapterState({
|
||
success: function(res) {
|
||
if (!res.available) {
|
||
console.log('蓝牙不可用');
|
||
return;
|
||
}
|
||
if (!res.discovering) {
|
||
console.log('蓝牙正在搜索中');
|
||
// 实际业务中可能需要根据需求处理
|
||
}
|
||
if (res.authorized) {
|
||
console.log('已授权');
|
||
// 已授权，可以进行蓝牙操作
|
||
} else if (res.authorizing) {
|
||
console.log('正在授权');
|
||
// 正在请求授权
|
||
} else {
|
||
console.log('未授权');
|
||
// 未授权，需要请求授权
|
||
uni.authorize({
|
||
scope: 'scope.bluetooth',
|
||
success() {
|
||
console.log('授权成功');
|
||
// 授权成功，可以进行蓝牙操作
|
||
},
|
||
fail() {
|
||
console.log('授权失败');
|
||
// 用户拒绝授权或者授权失败
|
||
}
|
||
});
|
||
}
|
||
},
|
||
fail: function(err) {
|
||
console.log('获取蓝牙状态失败', err);
|
||
}
|
||
});
|
||
console.log(this.seeDetail, 'this.seeDetailthis.seeDetail');
|
||
if (this.seeDetail == false) {
|
||
let that = this
|
||
uni.getNetworkType({
|
||
success: function(res) {
|
||
console.log(res.networkType); // 输出网络类型，如 "wifi", "4g", "3g", "2g", "none"
|
||
if (res.networkType == 'none') {
|
||
that.netonlines = false
|
||
|
||
|
||
} else {
|
||
that.netonlines = true
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function(lb) {
|
||
// that.latitude = 23.440359
|
||
// that.longitude = 117.074552
|
||
// that.gps.latitude = 23.440359
|
||
// that.gps.longitude = 117.074552;
|
||
|
||
|
||
|
||
that.gps.latitude = lb.latitude;
|
||
that.gps.longitude = lb.longitude;
|
||
|
||
that.latitude = lb.latitude;
|
||
that.longitude = lb.longitude;
|
||
that.deviceGps.latitude = lb.latitude;
|
||
that.deviceGps.longitude = lb.longitude;
|
||
// console.log(that.areaInfo, 'that.areaInfo');
|
||
console.log('进入了1111111111111');
|
||
that.getArea()
|
||
if (that.qParam != 'null' && that.showagre == false) {
|
||
let qParam = that.qParam
|
||
console.log(qParam, 'qParamqParamqParam');
|
||
// 第2步: URL解码q参数
|
||
let decodedUrl = decodeURIComponent(qParam);
|
||
|
||
// 第3步: 使用正则表达式解析解码后的URL并提取查询参数
|
||
let sn = null;
|
||
let queryParams = decodedUrl.split('?')[1];
|
||
if (queryParams) {
|
||
let params = queryParams.split('&');
|
||
params.forEach(param => {
|
||
let [key, value] = param.split('=');
|
||
if (key === 'sn') {
|
||
sn = value;
|
||
}
|
||
});
|
||
}
|
||
that.sn = sn
|
||
// if (that.sn != '') {
|
||
|
||
|
||
// setTimeout(() => {
|
||
|
||
// if (!that.orderinfo.status) {
|
||
// that.deviceInfo(1)
|
||
// that.qParam = null
|
||
// // this.showdevice = true
|
||
// // this.deviceIndex = 1
|
||
// // this.type = 1
|
||
// } else {
|
||
// // this.showtcs=true
|
||
// }
|
||
// }, 700)
|
||
|
||
|
||
// }
|
||
}
|
||
// that.getmarks()
|
||
|
||
|
||
//
|
||
},
|
||
fail: function(error) {
|
||
uni.showToast({
|
||
title: '未获取到定位信息，请点击设置勾选允许位置信息，即可使用全部功能',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
// that.getmarks()
|
||
// 在这里处理获取位置信息失败的情况
|
||
}
|
||
|
||
})
|
||
|
||
|
||
|
||
|
||
// console.log('有网络连接');\
|
||
|
||
}
|
||
}
|
||
});
|
||
|
||
|
||
|
||
|
||
} else {
|
||
this.getinfo()
|
||
|
||
setTimeout(() => {
|
||
console.log(this.userinfo.balance, this.deviceIndex, this.showdevice,this.tozf,
|
||
'this.userinfo.balancethis.userinfo.balancethis.userinfo.balance');
|
||
if (this.userinfo.balance != 0 && this.deviceIndex == 1 && this
|
||
.showdevice == true&&this.tozf==true) {
|
||
this.tozf=false
|
||
this.taploadmask(1)
|
||
}
|
||
|
||
}, 300)
|
||
|
||
}
|
||
|
||
},
|
||
|
||
onHide() {
|
||
// 页面隐藏时清除定时器
|
||
if (this.timers) {
|
||
clearInterval(this.timers);
|
||
this.timers = null;
|
||
console.log('定时器已清除1');
|
||
}
|
||
xBlufi.listenDeviceMsgEvent(false, this.funListenDeviceMsgEvent);
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': false
|
||
});
|
||
},
|
||
onUnload() {
|
||
// 页面卸载时清除定时器
|
||
if (this.timers) {
|
||
clearInterval(this.timers);
|
||
this.timers = null;
|
||
console.log('定时器已清除2');
|
||
}
|
||
xBlufi.listenDeviceMsgEvent(false, this.funListenDeviceMsgEvent);
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': false
|
||
});
|
||
},
|
||
|
||
onBeforeUnmount() {
|
||
if (this.timers) {
|
||
clearInterval(this.timers);
|
||
this.timers = null;
|
||
console.log('定时器已清除3');
|
||
}
|
||
xBlufi.listenDeviceMsgEvent(false, this.funListenDeviceMsgEvent);
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': false
|
||
});
|
||
},
|
||
computed: {
|
||
|
||
|
||
userId() {
|
||
return this.$store.getters.userId;
|
||
},
|
||
|
||
isMeal() {
|
||
return this.$store.getters.isMeal;
|
||
},
|
||
|
||
showagre() {
|
||
return this.$store.getters.showagre;
|
||
},
|
||
},
|
||
methods: {
|
||
getArea() {
|
||
// this.showmap = false
|
||
// 发送请求获取数据
|
||
this.areaInfo = {}
|
||
// console.log(this.qParam, 'qParamqParamqParamqParam');
|
||
this.polyline = []
|
||
// if(this.qParam){
|
||
|
||
// }
|
||
// console.log(this.sn,'this.gps.sn this.gps.sn this.gps.sn ');
|
||
|
||
// console.log(this.qParam,'qParamqParamqParamqParam');
|
||
if (/^\d{7}$/.test(this.qParam)) {
|
||
this.gps.sn = this.qParam
|
||
console.log(this.gps.sn,'this.gps.sn this.gps.sn this.gps.sn ');
|
||
}
|
||
if (this.orderinfo.sn != '') {
|
||
this.gps.sn = this.orderinfo.sn
|
||
}
|
||
if (this.deviceInfos.sn) {
|
||
this.gps.sn = this.deviceInfos.sn
|
||
}
|
||
if (this.qParam != '' && this.qParam != null) {
|
||
this.sn = this.getSNFromQRCode(this.qParam);
|
||
|
||
if (this.sn != 0 && this.sn != '' && this.sn != null) {
|
||
this.gps.sn = this.sn
|
||
console.log(this.sn,'qParamqParamqParamqParam');
|
||
|
||
}
|
||
}
|
||
this.$u.get('/app/area/info?', this.gps).then((res) => {
|
||
// this.showmap = true
|
||
if (res.code === 200) {
|
||
|
||
// 处理接口返回的数据，将边界数据转换为地图组件需要的折线结构
|
||
const polylines = this.convertBoundaryToPolyline(res.data.boundaryStr)
|
||
// console.log(polylines,'polylinespolylinespolylines');
|
||
// .filter(area => area.boundaryStr) // 过滤掉boundary为空的数据
|
||
// .map(area => this.convertBoundaryToPolyline(area.boundaryStr));
|
||
// 更新折线数据
|
||
this.areaInfo = res.data
|
||
setTimeout(() => {
|
||
let abb = this.cleanedText()
|
||
console.log(abb.length, 'cleanedTextcleanedTextcleanedText');
|
||
|
||
// 计算滚动时间，基于文本宽度
|
||
this.duration = abb.length * 0.3; // 50 px/s 的速度
|
||
}, 200)
|
||
|
||
this.polyline.push(polylines)
|
||
console.log();
|
||
// console.log(this.areaInfo, 'areaInfoareaInfo');
|
||
uni.setStorageSync('areaId', res.data.areaId);
|
||
this.getinfo()
|
||
this.getmarks()
|
||
this.getlist()
|
||
this.getParking()
|
||
if (uni.getStorageSync('token')) {
|
||
this.getisInOrder()
|
||
|
||
}
|
||
const hasShownPopup = uni.getStorageSync('hasShownPopup');
|
||
console.log(hasShownPopup, 'hasShownPopup');
|
||
|
||
if (hasShownPopup === '' || hasShownPopup === null) {
|
||
console.log('1111111111');
|
||
|
||
this.showTips = true;
|
||
this.startCountdown();
|
||
uni.setStorageSync('hasShownPopup', true);
|
||
} else {
|
||
console.log('222');
|
||
this.showTips = uni.getStorageSync('hasShownPopup');
|
||
console.log(this.showTips, 'this.showTips');
|
||
this.startCountdown();
|
||
|
||
}
|
||
if (this.gps.sn&&/^\d{7}$/.test(this.gps.sn)) {
|
||
setTimeout(() => {
|
||
if (this.orderinfo.status) {
|
||
// this.showtcs = true
|
||
} else {
|
||
// if(this.showdevice==false&&){
|
||
// console.log('进入的判断1');
|
||
// this.deviceInfo(1)
|
||
// this.qParam = null
|
||
// }
|
||
if(this.deviceInfos.sn){
|
||
|
||
}else{
|
||
if (this.qParam ) {
|
||
console.log('进入的判断2');
|
||
this.deviceInfo(1)
|
||
this.qParam = null
|
||
} else{
|
||
console.log('进入的判断3');
|
||
// if(this.de)
|
||
this.deviceInfo(0)
|
||
this.qParam = null
|
||
}
|
||
}
|
||
|
||
|
||
|
||
}
|
||
|
||
}, 200)
|
||
|
||
}
|
||
|
||
// if(!hasShownPopup){
|
||
// console.log(typeof(hasShownPopup),'hasShownPopuphasShownPopup');
|
||
// this.showTips=uni.getStorageSync('hasShownPopup')
|
||
// }else{
|
||
// this.showTips=true
|
||
// uni.setStorageSync('hasShownPopup', true);
|
||
// }
|
||
|
||
// this.$store.commit('SET_SHOWTIPS', true);
|
||
// console.log(this.polyline);
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching area data:", error);
|
||
});
|
||
|
||
},
|
||
deviceInfo(num) {
|
||
if (uni.getStorageSync('token')) {
|
||
|
||
if(this.sn){
|
||
this.$u.get('/app/device/info?sn=' + this.sn).then((res) => {
|
||
if (res.code === 200) {
|
||
this.isqrcode = true
|
||
this.deviceInfos = res.data;
|
||
if (!this.orderinfo.sn) {
|
||
this.mac = res.data.mac
|
||
}
|
||
if (num == 0) {
|
||
this.showdevice = true;
|
||
this.type = 0;
|
||
if (this.areaInfo.areaId != res.data.areaId) {
|
||
this.getArea()
|
||
}
|
||
// this.routePlanning(res.data.latitude, res.data.longitude)
|
||
// setTimeout(() => {
|
||
|
||
// // this.deviceIndex = 1;
|
||
// }, 600)
|
||
} else {
|
||
// if (this.deviceInfos.onlineStatus == 0) {
|
||
// wx.showToast({
|
||
// title: '车辆离线中,请使用其他车辆',
|
||
// icon: 'none',
|
||
// duration: 4000
|
||
// });
|
||
// } else
|
||
if (this.deviceInfos.status == 0) {
|
||
uni.showToast({
|
||
title: '车辆未上架,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 2) {
|
||
uni.showToast({
|
||
title: '车辆预约中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 3) {
|
||
uni.showToast({
|
||
title: '车辆骑行中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 4) {
|
||
uni.showToast({
|
||
title: '车辆临时锁车中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 6) {
|
||
uni.showToast({
|
||
title: '车辆调度中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 8) {
|
||
uni.showToast({
|
||
title: '车辆下线中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 9) {
|
||
uni.showToast({
|
||
title: '车辆已废弃,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 7) {
|
||
uni.showToast({
|
||
title: '车辆未上线,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status == 1) {
|
||
|
||
if (this.areaInfo.areaId != res.data.areaId) {
|
||
this.getArea()
|
||
}
|
||
// this.routePlanning(res.data.latitude, res.data.longitude)
|
||
setTimeout(() => {
|
||
this.showdevice = true
|
||
this.type = 1;
|
||
this.deviceIndex = 1;
|
||
}, 600)
|
||
|
||
}
|
||
}
|
||
} else {
|
||
this.showdevice = false;
|
||
this.deviceIndex = 0;
|
||
this.type = 0;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
|
||
|
||
}
|
||
|
||
} else {
|
||
console.log('判断2');
|
||
wx.login({
|
||
success: (res) => {
|
||
if (res.code) {
|
||
console.log('登录！', res);
|
||
let data = {
|
||
wxOpenId: res.code,
|
||
};
|
||
let areaId = uni.getStorageSync('areaId');
|
||
if (areaId) {
|
||
this.$u.post('/loginByopenid?jsCode=' + res.code + '&areaId=' +
|
||
areaId)
|
||
.then((
|
||
res) => {
|
||
// uni.hideLoading();
|
||
if (res.code == 200) {
|
||
uni.setStorageSync('token', res.token);
|
||
this.getinfo()
|
||
if(this.sn){
|
||
this.$u.get('/app/device/info?sn=' + this.sn)
|
||
.then((
|
||
res) => {
|
||
if (res.code === 200) {
|
||
this.isqrcode = true
|
||
this.deviceInfos = res.data;
|
||
|
||
if (num == 0) {
|
||
// this.routePlanning(res.data.latitude,
|
||
// res.data.longitude)
|
||
this.showdevice = true;
|
||
this.type = 0;
|
||
} else {
|
||
// if (this.deviceInfos
|
||
// .onlineStatus ==
|
||
// 0) {
|
||
// uni.showToast({
|
||
// title: '车辆离线中,请使用其他车辆',
|
||
// icon: 'none',
|
||
// duration: 4000
|
||
// });
|
||
// } else
|
||
if (this.deviceInfos
|
||
.status ==
|
||
0) {
|
||
uni.showToast({
|
||
title: '车辆未上架,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
2) {
|
||
uni.showToast({
|
||
title: '车辆预约中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
3) {
|
||
uni.showToast({
|
||
title: '车辆骑行中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
4) {
|
||
uni.showToast({
|
||
title: '车辆临时锁车中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos.status ==
|
||
6) {
|
||
uni.showToast({
|
||
title: '车辆调度中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
8) {
|
||
uni.showToast({
|
||
title: '车辆下线中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
9) {
|
||
uni.showToast({
|
||
title: '车辆已废弃,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
7) {
|
||
uni.showToast({
|
||
title: '车辆未上线,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 4000
|
||
});
|
||
} else if (this.deviceInfos
|
||
.status ==
|
||
1) {
|
||
// this.routePlanning(res.data
|
||
// .latitude, res.data
|
||
// .longitude)
|
||
if (this.areaInfo != res.data
|
||
.areaId) {
|
||
this.getArea()
|
||
}
|
||
// this.routePlanning(res.data.latitude, res.data.longitude)
|
||
setTimeout(() => {
|
||
this.showdevice = true
|
||
this.type = 1;
|
||
this.deviceIndex = 1;
|
||
}, 600)
|
||
}
|
||
}
|
||
} else {
|
||
this.showdevice = false;
|
||
this.deviceIndex = 0;
|
||
this.type = 0;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
|
||
}
|
||
|
||
} else if (res.code == 501) {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
} else {
|
||
uni.redirectTo({
|
||
url: '/pages/login/login'
|
||
});
|
||
}
|
||
});
|
||
|
||
}
|
||
|
||
}
|
||
},
|
||
});
|
||
}
|
||
},
|
||
|
||
|
||
mapFun() {
|
||
console.log('点击了');
|
||
uni.openLocation({
|
||
latitude: parseFloat(this.parkinfo.latitude),
|
||
//纬度 - 目的地/坐标点
|
||
longitude: parseFloat(this.parkinfo.longitude),
|
||
//经度 - 目的地/坐标点
|
||
// name: "荆门市",
|
||
address: this.parkinfo.parkingName
|
||
});
|
||
},
|
||
tochange() {
|
||
this.seeDetail = false
|
||
|
||
uni.navigateTo({
|
||
url: '/page_user/changeCar'
|
||
})
|
||
},
|
||
tovadio() {
|
||
// this.seeDetail=true
|
||
this.maskepage = 0
|
||
this.maskloading = false
|
||
uni.navigateTo({
|
||
url: '/page_user/vadio_back'
|
||
})
|
||
},
|
||
toggleOrderTips() {
|
||
this.isCollapsed = !this.isCollapsed;
|
||
},
|
||
toggleTips() {
|
||
if (this.showordertxt) {
|
||
// 当内容显示时，缩小动画
|
||
this.animateWidth(192); // 缩小到 192
|
||
} else {
|
||
// 当内容隐藏时，扩展动画
|
||
this.animateWidth(686); // 扩展到 686
|
||
}
|
||
this.showordertxt = !this.showordertxt; // 切换显示状态
|
||
},
|
||
animateWidth(targetWidth) {
|
||
const startWidth = this.orderwidth;
|
||
const startTime = Date.now();
|
||
const duration = 1500; // 动画时长 1.5s
|
||
|
||
const animate = () => {
|
||
const currentTime = Date.now();
|
||
const elapsedTime = currentTime - startTime;
|
||
|
||
if (elapsedTime >= duration) {
|
||
this.orderwidth = targetWidth; // 动画结束时设置最终宽度
|
||
return;
|
||
}
|
||
|
||
const progress = elapsedTime / duration;
|
||
this.orderwidth = startWidth + (targetWidth - startWidth) * progress;
|
||
|
||
setTimeout(animate, 16); // 使用 setTimeout 实现平滑更新，约每16ms更新一次
|
||
};
|
||
|
||
animate();
|
||
},
|
||
cleanedText() {
|
||
return this.areaInfo.agreement.replace(/<\/?[^>]+(>|$)/g, "");
|
||
},
|
||
tryagain() {
|
||
if (this.buleclose) {
|
||
this.buleclose = false
|
||
this.loackdevice()
|
||
}
|
||
if (this.buleopen) {
|
||
this.buleopen = false
|
||
this.unloackdevices()
|
||
}
|
||
if (this.buleback) {
|
||
this.buleback = false
|
||
this.cheackgps()
|
||
}
|
||
if (this.bulepayback) {
|
||
this.bulepayback = false
|
||
this.payback()
|
||
}
|
||
// bulepayback: false,
|
||
// bulebindcar: false,
|
||
},
|
||
routePlanning(end_lat, end_long) {
|
||
console.log('调用了');
|
||
let that = this
|
||
qqmapsdk.direction({
|
||
mode: 'walking', // 驾车
|
||
from: { // 起始位置(当前位置)坐标
|
||
latitude: that.latitude,
|
||
longitude: that.longitude
|
||
},
|
||
to: { // 目的地坐标
|
||
latitude: end_lat,
|
||
longitude: end_long,
|
||
},
|
||
// 目的地位置坐标
|
||
success(res) {
|
||
// console.log(res)
|
||
var coors = res.result.routes[0].polyline
|
||
var pl = [] // 点串数组
|
||
// 坐标解压(返回的点串坐标，通过前向差分进行压缩)
|
||
var kr = 1000000
|
||
for (var i = 2; i < coors.length; i++) {
|
||
coors[i] = Number(coors[i - 2]) + Number(coors[i]) / kr
|
||
}
|
||
// 将解压后的坐标放入点串数组pl中
|
||
for (var i = 0; i < coors.length; i += 2) {
|
||
pl.push({
|
||
latitude: coors[i],
|
||
longitude: coors[i + 1]
|
||
})
|
||
}
|
||
// console.log('点串数组', pl)
|
||
// 设置polyline属性，将路线显示出来，将解压坐标第一个数据作为起点
|
||
that.mappolyline = [{
|
||
points: pl,
|
||
// color: '#367EEF', // 线的填充色
|
||
// width: 3, // 折现宽度
|
||
// borderWidth: 2, // 边线宽度
|
||
// borderColor: '#5B98FD', // 边线颜色
|
||
// lineCap: 'square', // 线端头
|
||
// showArrow: true, // 沿线路方向显示箭头
|
||
width: 8,
|
||
arrowLine: true,
|
||
color: '#00AF99',
|
||
strokeWidth: 2,
|
||
strokeColor: '#00AF99',
|
||
fillColor: '#00AF99'
|
||
}]
|
||
// console.log(that.mappolyline, 'that.mappolylinethat.mappolyline');
|
||
},
|
||
fail(res) {
|
||
console.log('resresresresresresres', res)
|
||
}
|
||
})
|
||
},
|
||
closemaske() {
|
||
this.maskloading = false
|
||
this.backfalse = 0
|
||
this.isupload = false
|
||
},
|
||
|
||
onMapTap(event) {
|
||
this.showdevice = false
|
||
this.deviceIndex = 0
|
||
// this.sn = ''
|
||
this.type = 0
|
||
// this.freeInfo = {}
|
||
// this.freeListIndex = 0
|
||
this.mappolyline = []
|
||
// this.showparkinfo=false
|
||
// this.parkinfo={}
|
||
// this.lastClickedMarkerId=null
|
||
// const {
|
||
// latitude,
|
||
// longitude
|
||
// } = event.detail;
|
||
// console.log('Map tapped at:', latitude, longitude);
|
||
// this.close()
|
||
// 在这里添加你的回调逻辑
|
||
},
|
||
tapsn(sn) {
|
||
const markerExists = this.listData.some(item => item.sn == sn);
|
||
|
||
if (markerExists) {
|
||
this.sn = sn;
|
||
this.deviceInfo(0);
|
||
|
||
// Revert the last clicked marker to the default image and zIndex
|
||
if (this.lastClickedMarkerId !== null) {
|
||
this.markers = this.markers.map(marker => {
|
||
if (marker.id == this.lastClickedMarkerId) {
|
||
return {
|
||
...marker,
|
||
iconPath: this.defaultMarkerIconPath,
|
||
width: 40,
|
||
height: 28,
|
||
// zIndex: 1 // Reset to default zIndex
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
}
|
||
|
||
// Update the clicked marker's image and zIndex
|
||
this.markers = this.markers.map(marker => {
|
||
if (marker.id == sn) {
|
||
return {
|
||
...marker,
|
||
iconPath: this.clickedMarkerIconPath,
|
||
width: 50,
|
||
height: 35
|
||
// zIndex: 999 // Higher zIndex to bring it to the front
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
|
||
// Store the ID of the currently clicked marker
|
||
this.lastClickedMarkerId = sn;
|
||
|
||
|
||
} else {
|
||
console.log('Marker ID does not exist in the list data');
|
||
}
|
||
},
|
||
onMarkerTap(e) {
|
||
|
||
this.showdevice = false;
|
||
this.deviceIndex = 0;
|
||
this.type = 0;
|
||
// this.freeInfo = {};
|
||
// this.freeListIndex = 0;
|
||
this.parkinfo = {}
|
||
this.showparkinfo = false
|
||
if (e.type === 'markertap') {
|
||
console.log('Clicked marker:', e.markerId);
|
||
let parkmark = this.parkingList.some(item => item.parkingId == e.markerId);
|
||
if (parkmark) {
|
||
const matchingItem = this.parkingList.find(item => item.parkingId == e.markerId);
|
||
this.showparkinfo = true
|
||
this.parkinfo = matchingItem
|
||
console.log(matchingItem, 'parkmarkparkmark');
|
||
e.stopPropagation();
|
||
}
|
||
|
||
const markerExists = this.listData.some(item => item.sn == e.markerId);
|
||
|
||
if (markerExists) {
|
||
this.sn = e.markerId;
|
||
this.deviceInfo(0);
|
||
|
||
// Revert the last clicked marker to the default image and zIndex
|
||
if (this.lastClickedMarkerId !== null) {
|
||
this.markers = this.markers.map(marker => {
|
||
if (marker.id === this.lastClickedMarkerId) {
|
||
return {
|
||
...marker,
|
||
iconPath: this.defaultMarkerIconPath,
|
||
width: 40,
|
||
height: 28,
|
||
// zIndex: 1 // Reset to default zIndex
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
}
|
||
this.lastClickedMarkerId = e.markerId;
|
||
// Update the clicked marker's image and zIndex
|
||
this.markers = this.markers.map(marker => {
|
||
if (marker.id === e.markerId) {
|
||
return {
|
||
...marker,
|
||
iconPath: this.clickedMarkerIconPath,
|
||
width: 50,
|
||
height: 35
|
||
// zIndex: 999 // Higher zIndex to bring it to the front
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
|
||
// Store the ID of the currently clicked marker
|
||
|
||
|
||
// Get the latitude and longitude of the clicked marker
|
||
const clickedMarker = this.markers.find(marker => marker.id === e.markerId);
|
||
if (clickedMarker) {
|
||
const {
|
||
latitude,
|
||
longitude
|
||
} = clickedMarker;
|
||
console.log(`Clicked marker location - Latitude: ${latitude}, Longitude: ${longitude}`);
|
||
this.routePlanning(latitude, longitude)
|
||
// Find nearby markers
|
||
// this.getNearbyMarkers(latitude, longitude);
|
||
}
|
||
|
||
// console.log(this.markers, 'Updated markers');
|
||
} else {
|
||
console.log('Marker ID does not exist in the list data');
|
||
}
|
||
|
||
// Prevent event bubbling
|
||
e.stopPropagation();
|
||
}
|
||
},
|
||
getNearbyMarkers(clickedLat, clickedLon) {
|
||
const nearbyMarkers = this.listData.filter(item => {
|
||
if (item.latitude && item.longitude) {
|
||
const distance = this.haversineDistance(
|
||
parseFloat(clickedLat),
|
||
parseFloat(clickedLon),
|
||
parseFloat(item.latitude),
|
||
parseFloat(item.longitude)
|
||
);
|
||
return distance <= 15;
|
||
}
|
||
return false;
|
||
});
|
||
this.nearbyMarkers = nearbyMarkers
|
||
console.log('Nearby markers within 15 meters:', nearbyMarkers);
|
||
},
|
||
haversineDistance(lat1, lon1, lat2, lon2) {
|
||
const R = 6371e3; // Earth radius in meters
|
||
const toRad = angle => angle * Math.PI / 180;
|
||
const dLat = toRad(lat2 - lat1);
|
||
const dLon = toRad(lon2 - lon1);
|
||
const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
||
Math.cos(toRad(lat1)) * Math.cos(toRad(lat2)) *
|
||
Math.sin(dLon / 2) * Math.sin(dLon / 2);
|
||
const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
||
return R * c;
|
||
},
|
||
|
||
|
||
timestare() {
|
||
this.timers = setInterval(() => {
|
||
this.getmarks();
|
||
|
||
if (this.orderinfo.sn) {
|
||
this.$u.get('/app/device/info?sn=' + this.orderinfo.sn).then((res) => {
|
||
if (res.code === 200) {
|
||
// this.isqrcode=false
|
||
this.mac = this.OrderdeviceInfos.mac;
|
||
|
||
// this.OrderdeviceInfos.onlineStatus = '1'
|
||
if (this.OrderdeviceInfos.onlineStatus !== res.data.onlineStatus) {
|
||
this.OrderdeviceInfos = res.data;
|
||
}
|
||
|
||
if (this.OrderdeviceInfos.status !== res.data.status) {
|
||
this.getisInOrder();
|
||
}
|
||
|
||
const sn = parseFloat(res.data.sn);
|
||
const latitude = parseFloat(res.data.latitude);
|
||
const longitude = parseFloat(res.data.longitude);
|
||
|
||
// 查找现有的marker
|
||
let markerIndex = this.markers.findIndex(marker => marker.id === sn);
|
||
|
||
if (markerIndex !== -1) {
|
||
// 更新已有的marker
|
||
this.markers[markerIndex].latitude = latitude;
|
||
this.markers[markerIndex].longitude = longitude;
|
||
} else {
|
||
// 添加新的marker
|
||
const specificDeviceMarker = {
|
||
id: sn,
|
||
latitude: latitude,
|
||
longitude: longitude,
|
||
width: 5,
|
||
height: 5,
|
||
iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/u4D2g8B76trqZLhIiNWN'
|
||
};
|
||
this.markers.push(specificDeviceMarker);
|
||
}
|
||
|
||
// 强制更新 markers 数据
|
||
this.$set(this, 'markers', [...this.markers]);
|
||
|
||
} else {
|
||
// 处理接口返回错误的情况
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching specific device data:", error);
|
||
});
|
||
} else {
|
||
// 查找并移除对应的marker
|
||
const markerIndex = this.markers.findIndex(marker => marker.id === parseFloat(this
|
||
.OrderdeviceInfos.sn));
|
||
if (markerIndex !== -1) {
|
||
this.markers.splice(markerIndex, 1);
|
||
// 强制更新 markers 数据
|
||
this.$set(this, 'markers', [...this.markers]);
|
||
}
|
||
}
|
||
}, 3000); // 每3秒执行一次
|
||
},
|
||
toggleIconAndCallout() {
|
||
this.showIconAndCallout = !this.showIconAndCallout;
|
||
this.markers = this.markers.map(marker => {
|
||
if (this.showIconAndCallout) {
|
||
// Show callout
|
||
if (marker.isParkingMarker) {
|
||
marker.callout.display = 'ALWAYS';
|
||
marker.isCalloutVisible = true;
|
||
}
|
||
} else {
|
||
// Hide callout
|
||
if (marker.isParkingMarker) {
|
||
marker.callout.display = 'BYCLICK';
|
||
marker.isCalloutVisible = false;
|
||
}
|
||
}
|
||
return marker;
|
||
});
|
||
// Force update markers array
|
||
this.$set(this, 'markers', [...this.markers]);
|
||
},
|
||
|
||
getParking() {
|
||
// Send request to get data
|
||
let data = {
|
||
areaId: this.areaInfo.areaId
|
||
};
|
||
this.$u.get('/app/parking/list?', data).then((res) => {
|
||
if (res.code === 200) {
|
||
// Process returned data
|
||
const type1Data = [];
|
||
const type2Data = [];
|
||
const type3Data = [];
|
||
|
||
res.rows.forEach(row => {
|
||
if (row.type == 1) {
|
||
type1Data.push(row);
|
||
} else if (row.type == 2) {
|
||
type2Data.push(row);
|
||
} else if (row.type == 3) {
|
||
type3Data.push(row);
|
||
}
|
||
});
|
||
const validBoundaries = type1Data.map(row => row.boundaryStr).filter(
|
||
boundary => typeof boundary === 'string' && boundary.trim() !== '');
|
||
const polylines = this.convertBoundaryToPolylines(validBoundaries, 1);
|
||
|
||
const validBoundaries1 = type2Data.map(row => row.boundaryStr).filter(
|
||
boundary => typeof boundary === 'string' && boundary.trim() !== '');
|
||
const polylines1 = this.convertBoundaryToPolylines(validBoundaries1, 2);
|
||
|
||
const validBoundaries2 = type3Data.map(row => row.boundaryStr).filter(
|
||
boundary => typeof boundary === 'string' && boundary.trim() !== '');
|
||
const polylines2 = this.convertBoundaryToPolylines(validBoundaries2, 3);
|
||
|
||
// Add processed data to this.polyline
|
||
this.polyline = this.polyline.concat(polylines2);
|
||
this.polyline = this.polyline.concat(polylines1);
|
||
this.polyline = this.polyline.concat(polylines);
|
||
this.parkingList = res.rows;
|
||
|
||
// Set parking markers and distinguish them
|
||
const newParkingMarkers = res.rows.map(item => ({
|
||
id: parseFloat(item.parkingId),
|
||
latitude: parseFloat(item.latitude),
|
||
longitude: parseFloat(item.longitude),
|
||
width: 20,
|
||
height: 29,
|
||
iconPath: item.type == 1 ?
|
||
'https://lxnapi.ccttiot.com/bike/img/static/up2xXqAgwCX5iER600k3' :
|
||
item.type == 2 ?
|
||
'https://lxnapi.ccttiot.com/bike/img/static/u53BAQcFIX3vxsCzEZ7t' :
|
||
'https://lxnapi.ccttiot.com/bike/img/static/uDNY5Q4zOiZTCBTA2Jdq',
|
||
callout: {
|
||
content: item.parkingName,
|
||
color: '#ffffff',
|
||
fontSize: 14,
|
||
borderRadius: 10,
|
||
bgColor: item.type == 1 ? '#3A7EDB' : item.type == 2 ?
|
||
'#FFC107' : '#FF473E',
|
||
padding: 6,
|
||
display: 'BYCLICK' // Initially do not show callout
|
||
},
|
||
isCalloutVisible: false, // Initially do not show callout
|
||
isParkingMarker: true // Distinguish as parking marker
|
||
}));
|
||
|
||
// Preserve device markers and specific device marker
|
||
const preservedMarkers = this.markers.filter(marker => marker.isDeviceMarker || marker
|
||
.id === this.specificDeviceMarkerId);
|
||
|
||
// Merge parking markers and device markers
|
||
this.markers = [...newParkingMarkers, ...preservedMarkers];
|
||
this.$set(this, 'markers', [...this.markers]);
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching parking data:", error);
|
||
});
|
||
},
|
||
|
||
|
||
totxtpage() {
|
||
this.seeDetail = true
|
||
uni.navigateTo({
|
||
url: '/page_user/bulelink'
|
||
})
|
||
},
|
||
offopencar() {
|
||
this.bulebindcar = true
|
||
this.Binddevice()
|
||
},
|
||
bluesub1() {
|
||
// uni.showLoading({});
|
||
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
mark: "确认开锁",
|
||
type: '1',
|
||
isBluetooth: true,
|
||
lon: this.backgps.longitude,
|
||
lat: this.backgps.latitude
|
||
|
||
};
|
||
|
||
if (this.carstause) {
|
||
this.$u.post('/appVerify/device/snSwitch', data).then((res) => {
|
||
// uni.hideLoading();
|
||
this.seeDetail = false;
|
||
if (res.code === 200) {
|
||
this.opencar()
|
||
this.backfalse = 0
|
||
this.loadimg = 'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '开锁成功';
|
||
this.buletxt = '开锁成功';
|
||
this.lastClickedMarkerId = null
|
||
this.mappolyline = []
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
}, 800);
|
||
} else {
|
||
if (res.msg == '您还未充值押金，请先充值押金') {
|
||
// this.close();
|
||
// this.maskloading = false;
|
||
this.maskepage = 6
|
||
this.showYjTip = true;
|
||
} else if (res.msg == '【扫码/编号开锁骑行】发送开锁命令失败') {
|
||
this.maskepage = 3
|
||
} else if (res.msg == '低电量不得骑行') {
|
||
this.maskepage = 7
|
||
// this.offopencar()
|
||
} else {
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
this.toploadtxt = '开锁失败';
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 800);
|
||
}
|
||
}
|
||
});
|
||
} else {
|
||
this.bulebindcar = true
|
||
this.Binddevice()
|
||
}
|
||
|
||
},
|
||
taploadmask(num) {
|
||
this.maskepage = 0
|
||
this.loadimg = 'https://lxnapi.ccttiot.com/bike/img/static/uRxPPoVoqmnmng6wKlij'
|
||
if (num == 1) {
|
||
|
||
if (!this.checkBeforeUnlock()) {
|
||
return;
|
||
}
|
||
|
||
if (this.showxy) {
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `开锁中${percentage}%`;
|
||
} else {
|
||
clearInterval(interval);
|
||
this.toploadtxt = "开锁中98%";
|
||
}
|
||
}, 40); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
this.sub1();
|
||
}, 2100);
|
||
} else {
|
||
uni.showToast({
|
||
title: '请勾选协议',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
} else if (num == 2) {
|
||
//临时锁车
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `锁车中${percentage}%`;
|
||
} else {
|
||
console.log('调用了');
|
||
clearInterval(interval);
|
||
this.toploadtxt = "锁车中98%";
|
||
}
|
||
}, 40); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
this.loackdevice();
|
||
}, 2100);
|
||
|
||
} else if (num == 3) {
|
||
//解锁用车
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `开锁中${percentage}%`;
|
||
} else {
|
||
console.log('调用了');
|
||
clearInterval(interval);
|
||
this.toploadtxt = "开锁中98%";
|
||
}
|
||
}, 40); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
|
||
this.unloackdevices();
|
||
}, 2100);
|
||
|
||
} else if (num == 4) {
|
||
|
||
|
||
if (this.areaInfo.returnVerify == 1 && this.isupload == false) {
|
||
this.maskloading = true
|
||
this.maskepage = 8
|
||
} else {
|
||
this.isupload = false
|
||
// 还车校验
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `还车地点校验中${percentage}%`;
|
||
} else {
|
||
clearInterval(interval);
|
||
this.toploadtxt = "还车地点校验中98%";
|
||
}
|
||
}, 40); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
this.cheackgps();
|
||
}, 2100);
|
||
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
|
||
Binddevice() {
|
||
uni.getBluetoothAdapterState({
|
||
success: function(res) {
|
||
console.log('蓝牙状态：', res.available)
|
||
},
|
||
fail: function(res) {
|
||
console.log('获取蓝牙状态失败')
|
||
}
|
||
})
|
||
this.devicesList = []
|
||
this.maskepage = 4
|
||
this.buletxt = '蓝牙连接中'
|
||
// uni.showLoading({
|
||
// title: '蓝牙扫描中..'
|
||
// })
|
||
xBlufi.initXBlufi(1);
|
||
console.log("xBlufi", xBlufi.XMQTT_SYSTEM);
|
||
xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvent);
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': true
|
||
});
|
||
|
||
|
||
// 两秒后停止蓝牙搜索
|
||
setTimeout(() => {
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': false
|
||
});
|
||
setTimeout(() => {
|
||
// uni.hideLoading()
|
||
if (this.devicesList.length == 0) {
|
||
// uni.showToast({
|
||
// title: '暂无发现对应设备,请靠近设备',
|
||
// icon: 'none',
|
||
// duration: 1500
|
||
// });
|
||
this.maskepage = 5
|
||
} else {
|
||
let uniqueDevicesList = Array.from(new Set(this.devicesList));
|
||
|
||
// 将去重后的数组重新赋值给 this.devicesList
|
||
this.devicesList = uniqueDevicesList;
|
||
console.log(this.devicesList, 'this.devicesListthis.devicesList');
|
||
let istrue = false
|
||
this.devicesList.forEach(device => {
|
||
// 从设备名称中提取 MAC 地址（假设 MAC 地址是设备名称的后6个字符）
|
||
let macFromName = device.name.substring(device.name.length - 12);
|
||
console.log(macFromName, 'macFromNamemacFromName');
|
||
// 与 this.mac 进行比较
|
||
if (macFromName == this.mac) {
|
||
// 如果相同，则将 this.ishave 设置为 true
|
||
console.log(device);
|
||
this.deviceInfoss = device
|
||
// this.ishave = true;
|
||
istrue = true
|
||
this.createBLEConnection(device)
|
||
|
||
console.log('对比正确1111111111');
|
||
} else {
|
||
console.log('对比错误');
|
||
|
||
}
|
||
});
|
||
setTimeout(() => {
|
||
if (!istrue) {
|
||
this.buletxt = '蓝牙连接失败'
|
||
|
||
|
||
setTimeout(() => {
|
||
this.maskepage = 5
|
||
}, 500)
|
||
}
|
||
|
||
}, 500)
|
||
}
|
||
|
||
|
||
}, 200)
|
||
// 判断是否存在浇花器设备
|
||
|
||
// this.status = true
|
||
}, 5000)
|
||
|
||
},
|
||
cheackgps() {
|
||
let that = this
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function(lb) {
|
||
|
||
|
||
let data = {
|
||
latitude: lb.latitude,
|
||
longitude: lb.longitude,
|
||
areaId: that.areaInfo.areaId,
|
||
sn: that.OrderdeviceInfos.sn
|
||
}
|
||
that.backgps.latitude = lb.latitude
|
||
that.backgps.longitude = lb.longitude
|
||
that.$u.get('/appVerify/isInParkingArea?', data).then((res) => {
|
||
|
||
if (res.code == 200) {
|
||
// let parkingReturn = false
|
||
// let isInParkingArea = false
|
||
let parkingReturn = res.data
|
||
.parkingReturn /** 强制停车点还车 true:开启，false:关闭*/
|
||
let isInParkingArea = res.data.isInParkingArea /** 是否在停车区内*/
|
||
that.isInParkingArea = res.data
|
||
.isInParkingArea
|
||
if (parkingReturn) {
|
||
// 不可以在停车点外还车
|
||
if (isInParkingArea) {
|
||
// 在停车点内
|
||
if (that.OrderdeviceInfos.onlineStatus == 1 && that.backfalse <
|
||
1) {
|
||
// 设备未离线
|
||
that.backDevice()
|
||
} else if (that.OrderdeviceInfos.onlineStatus == 0 || that
|
||
.backfalse >= 1) {
|
||
if (that.carstause) {
|
||
|
||
that.$u.post(
|
||
'/appVerify/device/return?returnType=1&orderNo=' +
|
||
that.orderinfo.orderNo + '&isBluetooth=true' +
|
||
'&lon=' + that.backgps.longitude + '&lat=' +
|
||
that.backgps.latitude + '&isInParkingArea=' +
|
||
that.isInParkingArea).then((
|
||
res) => {
|
||
|
||
if (res.code === 200) {
|
||
that.reboot()
|
||
that.backfalse = 0
|
||
that.isbackdevice = false
|
||
// that.close()
|
||
// that.getisInOrder()
|
||
that.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
that.toploadtxt = '还车成功！';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
that.getisInOrder();
|
||
}, 1000);
|
||
|
||
} else {
|
||
that.toploadtxt = '还车失败';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 1000);
|
||
|
||
}
|
||
})
|
||
} else {
|
||
that.buleback = true
|
||
that.Binddevice()
|
||
|
||
}
|
||
}
|
||
} else {
|
||
that.maskepage = 1
|
||
}
|
||
} else {
|
||
if (isInParkingArea) {
|
||
// 在停车点内
|
||
if (that.OrderdeviceInfos.onlineStatus == 1 && that.backfalse <
|
||
1) {
|
||
// 设备未离线
|
||
that.backDevice()
|
||
} else if (that.OrderdeviceInfos.onlineStatus == 0 || that
|
||
.backfalse >= 1) {
|
||
if (that.carstause) {
|
||
|
||
that.$u.post(
|
||
'/appVerify/device/return?returnType=1&orderNo=' +
|
||
that.orderinfo
|
||
.orderNo + '&isBluetooth=true' + '&lon=' + that
|
||
.backgps.longitude + '&lat=' + that.backgps
|
||
.latitude + '&isInParkingArea=' + that
|
||
.isInParkingArea).then((
|
||
res) => {
|
||
|
||
if (res.code === 200) {
|
||
that.reboot()
|
||
that.backfalse = 0
|
||
that.isbackdevice = false
|
||
that.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
that.toploadtxt = '还车成功！';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
that.getisInOrder();
|
||
}, 1000);
|
||
|
||
// that.close()
|
||
// that.getisInOrder()
|
||
|
||
} else {
|
||
that.toploadtxt = '还车失败';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 1000);
|
||
}
|
||
})
|
||
} else {
|
||
that.buleback = true
|
||
that.Binddevice()
|
||
// that.isbackdevice = false
|
||
// that.isnoline = true
|
||
}
|
||
}
|
||
} else {
|
||
that.maskepage = 2
|
||
// if(that.OrderdeviceInfos.onlineStatus == 1){
|
||
// // 设备未离线
|
||
// that.maskepage=2
|
||
// }else{
|
||
// // if (that.carstause) {
|
||
|
||
// // that.$u.post('/appVerify/device/return?returnType=1&orderNo=' + that.orderinfo
|
||
// // .orderNo + '&isBluetooth=true' + '&lon=' + that.backgps.longitude + '&lat=' + that.backgps
|
||
// // .latitude).then((
|
||
// // res) => {
|
||
|
||
// // if (res.code === 200) {
|
||
// // that.reboot()
|
||
// // that.isbackdevice = false
|
||
|
||
// // that.loadimg = 'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
// // that.toploadtxt = '还车成功！';
|
||
// // setTimeout(() => {
|
||
// // that.maskloading = false;
|
||
// // that.getisInOrder();
|
||
// // }, 1000);
|
||
// // // that.close()
|
||
// // // that.getisInOrder()
|
||
|
||
// // } else {
|
||
// // uni.showToast({
|
||
// // title: res.msg,
|
||
// // icon: 'none',
|
||
// // duration: 2000
|
||
// // });
|
||
// // }
|
||
// // })
|
||
// // } else {
|
||
// // that.maskepage=3
|
||
// // // that.isbackdevice = false
|
||
// // // that.isnoline = true
|
||
// // }
|
||
// // }
|
||
|
||
}
|
||
}
|
||
} else {
|
||
that.toploadtxt = '校验失败';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 1000);
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
}
|
||
})
|
||
|
||
|
||
|
||
},
|
||
fail: function(error) {
|
||
|
||
}
|
||
|
||
})
|
||
},
|
||
payback() {
|
||
|
||
if (this.OrderdeviceInfos.onlineStatus == 1 && this.backfalse < 1) {
|
||
// 设备未离线
|
||
console.log('在线还车');
|
||
this.maskepage = 0
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `还车中${percentage}%`;
|
||
} else {
|
||
clearInterval(interval);
|
||
this.toploadtxt = "还车中98%";
|
||
}
|
||
}, 40); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
this.$u.post('/appVerify/device/return?returnType=1&orderNo=' + this.orderinfo.orderNo +
|
||
'&isInParkingArea=' + this.isInParkingArea).then((
|
||
res) => {
|
||
// res.code=500
|
||
if (res.code === 200) {
|
||
this.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '还车成功!';
|
||
this.backfalse = 0
|
||
setTimeout(() => {
|
||
this.close()
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
|
||
}, 800);
|
||
|
||
} else {
|
||
|
||
this.backfalse = this.backfalse + 1
|
||
this.payback()
|
||
// this.cheackgps()
|
||
// this.toploadtxt = '还车失败';
|
||
// setTimeout(() => {
|
||
// this.maskloading = false;
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }, 1000);
|
||
}
|
||
})
|
||
}, 2100);
|
||
|
||
} else if (this.OrderdeviceInfos.onlineStatus == 0 || this.backfalse >= 1) {
|
||
console.log('离线还车');
|
||
this.maskepage = 0
|
||
this.maskloading = true;
|
||
let percentage = 0;
|
||
const interval = setInterval(() => {
|
||
if (percentage < 98) {
|
||
percentage += 2; // 每次增加的百分比，可以调整
|
||
this.toploadtxt = `还车中${percentage}%`;
|
||
} else {
|
||
clearInterval(interval);
|
||
this.toploadtxt = "还车中98%";
|
||
}
|
||
}, 20); // 每40毫秒更新一次，可以调整
|
||
setTimeout(() => {
|
||
if (this.carstause == true) {
|
||
|
||
this.$u.post('/appVerify/device/return?returnType=1&orderNo=' + this.orderinfo
|
||
.orderNo + '&isBluetooth=true' + '&lon=' + this.backgps.longitude +
|
||
'&lat=' + this.backgps
|
||
.latitude + '&isInParkingArea=' + this.isInParkingArea).then((
|
||
res) => {
|
||
|
||
if (res.code === 200) {
|
||
this.reboot()
|
||
this.backfalse = 0
|
||
this.isbackdevice = false
|
||
this.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '还车成功！';
|
||
this.buletxt = '还车成功！';
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
}, 1000);
|
||
|
||
// that.close()
|
||
// that.getisInOrder()
|
||
|
||
} else {
|
||
this.toploadtxt = '还车失败！';
|
||
this.buletxt = '还车失败！';
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
this.getisInOrder();
|
||
}, 1000);
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
}
|
||
})
|
||
} else {
|
||
this.bulepayback = true
|
||
this.Binddevice()
|
||
// this.maskepage = 3
|
||
// that.isbackdevice = false
|
||
// that.isnoline = true
|
||
}
|
||
}, 1100);
|
||
|
||
}
|
||
|
||
},
|
||
backDevice() {
|
||
|
||
this.$u.post('/appVerify/device/return?returnType=1&orderNo=' + this.orderinfo.orderNo +
|
||
'&isInParkingArea=' + this.isInParkingArea).then((
|
||
res) => {
|
||
|
||
if (res.code === 200) {
|
||
this.loadimg = 'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '还车成功!';
|
||
this.backfalse = 0
|
||
setTimeout(() => {
|
||
this.close()
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
|
||
}, 800);
|
||
|
||
} else {
|
||
|
||
this.backfalse = this.backfalse + 1
|
||
this.cheackgps()
|
||
// this.toploadtxt = '还车失败';
|
||
// setTimeout(() => {
|
||
// this.maskloading = false;
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }, 1000);
|
||
}
|
||
})
|
||
|
||
},
|
||
|
||
// 新增的检查函数
|
||
checkBeforeUnlock() {
|
||
// console.log(this.freeInfo,'this.freeInfothis.freeInfo');
|
||
if (!this.freeInfo.ruleId) {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
return false;
|
||
}
|
||
if (!this.showxy) {
|
||
uni.showToast({
|
||
title: '请勾选协议',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
return false;
|
||
}
|
||
|
||
if (this.areaInfo.authentication == 1 && this.userinfo.isAuthentication == 0) {
|
||
uni.hideLoading();
|
||
this.maskloading = false;
|
||
this.seeDetail = true;
|
||
uni.navigateTo({
|
||
url: "/page_user/idcard_test"
|
||
});
|
||
return false;
|
||
}
|
||
|
||
|
||
|
||
return true;
|
||
},
|
||
|
||
// 确认开锁
|
||
sub1() {
|
||
// uni.showLoading({});
|
||
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
mark: "确认开锁",
|
||
type: '1'
|
||
};
|
||
|
||
this.$u.post('/appVerify/device/snSwitch', data).then((res) => {
|
||
// uni.hideLoading();
|
||
this.seeDetail = false;
|
||
// res.code=500
|
||
// res.msg='低电量不得骑行'
|
||
if (res.code === 200) {
|
||
this.loadimg = 'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '开锁成功';
|
||
this.lastClickedMarkerId = null
|
||
this.mappolyline = []
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
}, 800);
|
||
} else {
|
||
if (res.msg == '您还未充值押金，请先充值押金') {
|
||
// this.close();
|
||
// this.maskloading = false;
|
||
this.maskepage = 6
|
||
this.showYjTip = true;
|
||
} else if (res.msg == '【扫码/编号开锁骑行】发送开锁命令失败') {
|
||
// this.maskepage=3 低电量不得骑行
|
||
this.offopencar()
|
||
} else if (res.msg == '低电量不得骑行') {
|
||
this.maskepage = 7
|
||
// this.offopencar()
|
||
} else {
|
||
|
||
this.toploadtxt = '开锁失败';
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 800);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
|
||
backDevicecar() {
|
||
this.isbackcar = true
|
||
},
|
||
gotowzysd() {
|
||
uni.navigateToMiniProgram({
|
||
appId: 'wxd7c0bb79b9d616c3', //目标小程序appid
|
||
path: 'pages/tabbar/index/index', //需要打开的目标路径
|
||
// extraData: {
|
||
// 'data1': 'test'
|
||
// },
|
||
// envVersion: 'release', //小程序版本：develop（开发版），trial（体验版），release（正式版）
|
||
success(res) {
|
||
// 打开成功
|
||
}
|
||
})
|
||
},
|
||
|
||
getmarks() {
|
||
if (this.isqrcode) {
|
||
let data = {
|
||
areaId: this.areaInfo.areaId
|
||
};
|
||
if (this.areaInfo.areaId) {
|
||
this.$u.get(`/app/allVehicleByArea`, data).then((res) => {
|
||
if (res.code === 200 && res.data != '') {
|
||
this.listData = res.data;
|
||
const newDeviceMarkers = this.listData.map(item => ({
|
||
id: parseFloat(item.sn),
|
||
latitude: parseFloat(item.latitude),
|
||
longitude: parseFloat(item.longitude),
|
||
width: 40,
|
||
height: 28,
|
||
iconPath: this.defaultMarkerIconPath,
|
||
isDeviceMarker: true // 区分为设备标记
|
||
}));
|
||
|
||
// 保留停车标记和特定设备标记
|
||
const preservedMarkers = this.markers.filter(marker => marker.isParkingMarker ||
|
||
marker
|
||
.id === parseFloat(this.OrderdeviceInfos.sn));
|
||
|
||
// 更新markers数组，避免删除已识别的重要标记
|
||
let updatedMarkers = [...newDeviceMarkers, ...preservedMarkers];
|
||
|
||
// 确保点击的标记保持其图标
|
||
if (this.lastClickedMarkerId != null) {
|
||
updatedMarkers = updatedMarkers.map(marker => {
|
||
if (marker.id === this.lastClickedMarkerId) {
|
||
return {
|
||
...marker,
|
||
width: 50,
|
||
height: 35,
|
||
iconPath: this.clickedMarkerIconPath
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
}
|
||
|
||
// 使用this.$set触发Vue的响应式更新
|
||
this.$set(this, 'markers', updatedMarkers);
|
||
|
||
this.oldMarkers = [...this.markers];
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching device data:", error);
|
||
});
|
||
}
|
||
|
||
} else {
|
||
let data = {
|
||
longitude: this.deviceGps.longitude,
|
||
latitude: this.deviceGps.latitude,
|
||
deptId: uni.getStorageSync('deptId')
|
||
|
||
}
|
||
|
||
|
||
this.$u.get(`/app/vehicleLocalization?`, data).then((res) => {
|
||
if (res.code === 200) {
|
||
if (res.data !== '') {
|
||
this.listData = res.data;
|
||
const newDeviceMarkers = this.listData.map(item => ({
|
||
id: parseFloat(item.sn),
|
||
latitude: parseFloat(item.latitude),
|
||
longitude: parseFloat(item.longitude),
|
||
width: 40,
|
||
height: 28,
|
||
iconPath: this.defaultMarkerIconPath,
|
||
isDeviceMarker: true // 区分为设备标记
|
||
}));
|
||
|
||
// 保留停车标记和特定设备标记
|
||
const preservedMarkers = this.markers.filter(marker => marker.isParkingMarker ||
|
||
marker.id === parseFloat(this.OrderdeviceInfos.sn));
|
||
|
||
// 更新markers数组，避免删除已识别的重要标记
|
||
let updatedMarkers = [...newDeviceMarkers, ...preservedMarkers];
|
||
|
||
// 确保点击的标记保持其图标
|
||
if (this.lastClickedMarkerId != null) {
|
||
updatedMarkers = updatedMarkers.map(marker => {
|
||
if (marker.id === this.lastClickedMarkerId) {
|
||
return {
|
||
...marker,
|
||
width: 50,
|
||
height: 35,
|
||
iconPath: this.clickedMarkerIconPath
|
||
};
|
||
}
|
||
return marker;
|
||
});
|
||
}
|
||
|
||
// 使用this.$set触发Vue的响应式更新
|
||
this.$set(this, 'markers', updatedMarkers);
|
||
this.oldMarkers = [...this.markers];
|
||
} else {
|
||
// 当 res.data 为空时，删除 markers 中对应的设备标记
|
||
this.markers = this.markers.filter(marker => marker.isParkingMarker || marker
|
||
.id === parseFloat(this.OrderdeviceInfos.sn));
|
||
|
||
// 使用this.$set触发Vue的响应式更新
|
||
this.$set(this, 'markers', this.markers);
|
||
}
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching device data:", error);
|
||
});
|
||
|
||
}
|
||
|
||
|
||
|
||
},
|
||
|
||
|
||
onMapRegionChange(event) {
|
||
// console.log('regionchange', event)
|
||
if (event.detail.type == 'end') {
|
||
this.getCenterLanLat()
|
||
}
|
||
// 你可以在这里执行你需要的操作
|
||
},
|
||
getCenterLanLat() {
|
||
let that = this
|
||
uni.createMapContext("map", this).getCenterLocation({
|
||
type: 'gcj02',
|
||
success: (res) => {
|
||
console.log("当前地图中心的经纬度", res)
|
||
that.deviceGps.latitude = res.latitude;
|
||
that.deviceGps.longitude = res.longitude;
|
||
that.getmarks()
|
||
//其他逻辑
|
||
},
|
||
fail: (err) => {}
|
||
})
|
||
},
|
||
getAreas() {
|
||
|
||
this.$u.get('/app/area/info?', this.gps).then((res) => {
|
||
this.showmap = true
|
||
if (res.code === 200) {
|
||
|
||
// 处理接口返回的数据，将边界数据转换为地图组件需要的折线结构
|
||
const polylines = this.convertBoundaryToPolyline(res.data.boundaryStr)
|
||
// console.log(polylines,'polylinespolylinespolylines');
|
||
// .filter(area => area.boundaryStr) // 过滤掉boundary为空的数据
|
||
// .map(area => this.convertBoundaryToPolyline(area.boundaryStr));
|
||
// 更新折线数据
|
||
this.areaInfo = res.data
|
||
this.polyline.push(polylines)
|
||
console.log();
|
||
// console.log(this.areaInfo, 'areaInfoareaInfo');
|
||
uni.setStorageSync('areaId', res.data.areaId);
|
||
// this.getinfo()
|
||
// this.getmarks()
|
||
// this.getlist()
|
||
this.getParking()
|
||
|
||
|
||
|
||
|
||
// this.setMapScale()
|
||
// if(!hasShownPopup){
|
||
// console.log(typeof(hasShownPopup),'hasShownPopuphasShownPopup');
|
||
// this.showTips=uni.getStorageSync('hasShownPopup')
|
||
// }else{
|
||
// this.showTips=true
|
||
// uni.setStorageSync('hasShownPopup', true);
|
||
// }
|
||
|
||
// this.$store.commit('SET_SHOWTIPS', true);
|
||
// console.log(this.polyline);
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}).catch(error => {
|
||
console.error("Error fetching area data:", error);
|
||
});
|
||
},
|
||
|
||
keepback() {
|
||
let that = this
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function(lb) {
|
||
|
||
|
||
let data = {
|
||
latitude: lb.latitude,
|
||
longitude: lb.longitude,
|
||
areaId: that.areaInfo.areaId
|
||
}
|
||
if (that.carstause) {
|
||
|
||
that.$u.post('/appVerify/device/return?returnType=1&orderNo=' + that
|
||
.orderinfo
|
||
.orderNo + '&isBluetooth=true' + '&lon=' + lb.longitude + '&lat=' +
|
||
lb
|
||
.latitude).then((
|
||
res) => {
|
||
uni.hideLoading()
|
||
if (res.code === 200) {
|
||
that.reboot()
|
||
that.isbackdevice = false
|
||
that.close()
|
||
that.getisInOrder()
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
} else {
|
||
|
||
that.isbackdevice = false
|
||
that.isnoline = true
|
||
}
|
||
|
||
},
|
||
fail: function(error) {
|
||
// uni.showToast({
|
||
// title: '未获取到定位信息，请点击设置勾选允许位置信息，即可使用全部功能',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// that.getmarks()
|
||
// 在这里处理获取位置信息失败的情况
|
||
}
|
||
|
||
})
|
||
|
||
|
||
},
|
||
|
||
|
||
reboot() {
|
||
let vm = this; // 将外部的 this 绑定到 vm 上
|
||
uni.getNetworkType({
|
||
success(res) {
|
||
if (res.networkType !== 'none') {
|
||
uni.getConnectedBluetoothDevices({
|
||
success(res) {
|
||
console.log('已连接的蓝牙设备信息：', res);
|
||
// vm.dl = (vm.orderinfo.deviceAmount / vm.orderinfo.unitPrice).toFixed(2); // 使用 vm 访问 Vue 实例的属性
|
||
xBlufi.notifySendCustomData({
|
||
customData: "11reboot"
|
||
});
|
||
// uni.hideLoading()
|
||
// vm.remakr()
|
||
},
|
||
fail(err) {
|
||
uni.hideLoading()
|
||
console.error('获取已连接蓝牙设备信息失败：', err);
|
||
}
|
||
});
|
||
} else {
|
||
console.log('手机未连接网络');
|
||
}
|
||
}
|
||
});
|
||
},
|
||
opencar() {
|
||
let vm = this; // 将外部的 this 绑定到 vm 上
|
||
uni.getNetworkType({
|
||
success(res) {
|
||
if (res.networkType !== 'none') {
|
||
uni.getConnectedBluetoothDevices({
|
||
success(res) {
|
||
console.log('已连接的蓝牙设备信息：', res);
|
||
// vm.dl = (vm.orderinfo.deviceAmount / vm.orderinfo.unitPrice).toFixed(2); // 使用 vm 访问 Vue 实例的属性
|
||
xBlufi.notifySendCustomData({
|
||
customData: "11open"
|
||
});
|
||
// uni.hideLoading()
|
||
// vm.remakr()
|
||
},
|
||
fail(err) {
|
||
uni.hideLoading()
|
||
console.error('获取已连接蓝牙设备信息失败：', err);
|
||
}
|
||
});
|
||
} else {
|
||
console.log('手机未连接网络');
|
||
}
|
||
}
|
||
});
|
||
},
|
||
closecar() {
|
||
let vm = this; // 将外部的 this 绑定到 vm 上
|
||
uni.getNetworkType({
|
||
success(res) {
|
||
if (res.networkType !== 'none') {
|
||
uni.getConnectedBluetoothDevices({
|
||
success(res) {
|
||
console.log('已连接的蓝牙设备信息：', res);
|
||
// vm.dl = (vm.orderinfo.deviceAmount / vm.orderinfo.unitPrice).toFixed(2); // 使用 vm 访问 Vue 实例的属性
|
||
xBlufi.notifySendCustomData({
|
||
customData: "11llose"
|
||
});
|
||
// uni.hideLoading()
|
||
// vm.remakr()
|
||
},
|
||
fail(err) {
|
||
uni.hideLoading()
|
||
console.error('获取已连接蓝牙设备信息失败：', err);
|
||
}
|
||
});
|
||
} else {
|
||
console.log('手机未连接网络');
|
||
}
|
||
}
|
||
});
|
||
},
|
||
unloackdevices() {
|
||
if (this.OrderdeviceInfos.onlineStatus == 1 && this.backfalse < 1) {
|
||
// uni.showLoading({
|
||
// title: '加载中...'
|
||
// })
|
||
this.$u.post('/appVerify/device/unlock?sn=' + this.OrderdeviceInfos.sn + '&orderNo=' + this
|
||
.orderinfo
|
||
.orderNo).then((res) => {
|
||
|
||
if (res.code === 200) {
|
||
this.backfalse = 0
|
||
this.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '开锁成功';
|
||
this.buleopen = false
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
}, 1000);
|
||
|
||
} else {
|
||
this.backfalse = this.backfalse + 1
|
||
this.unloackdevices()
|
||
// this.toploadtxt = '开锁失败';
|
||
// setTimeout(() => {
|
||
// this.maskloading = false;
|
||
// }, 1000);
|
||
// if (res.msg == '10500-----') {
|
||
|
||
// uni.showToast({
|
||
// title: '系统异常，请重新尝试',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// } else {
|
||
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }
|
||
|
||
}
|
||
})
|
||
} else if (this.OrderdeviceInfos.onlineStatus == 0 || this.backfalse >= 1) {
|
||
if (this.carstause) {
|
||
|
||
|
||
let that = this
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function(lb) {
|
||
|
||
|
||
let data = {
|
||
latitude: lb.latitude,
|
||
longitude: lb.longitude,
|
||
areaId: that.areaInfo.areaId
|
||
}
|
||
that.$u.post('/appVerify/device/unlock?sn=' + that.OrderdeviceInfos
|
||
.sn + '&orderNo=' + that.orderinfo.orderNo +
|
||
'&isBluetooth=true' + '&lon=' + lb.longitude + '&lat=' + lb
|
||
.latitude).then((res) => {
|
||
|
||
if (res.code === 200) {
|
||
that.opencar()
|
||
that.buleopen = false
|
||
// console.log('发送了离线开锁请求');
|
||
// that.getisInOrder()
|
||
that.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
that.buletxt = '解锁成功';
|
||
that.toploadtxt = '解锁成功'
|
||
that.backfalse = 0
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
that.getisInOrder();
|
||
}, 1000);
|
||
} else {
|
||
|
||
that.toploadtxt = '开锁失败'
|
||
that.buletxt = '开锁失败';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 1000);
|
||
// if (res.msg == '10500-----') {
|
||
// uni.showToast({
|
||
// title: '系统异常，请重新尝试',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// } else {
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }
|
||
|
||
}
|
||
})
|
||
|
||
},
|
||
fail: function(error) {
|
||
// uni.showToast({
|
||
// title: '未获取到定位信息，请点击设置勾选允许位置信息，即可使用全部功能',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// that.getmarks()
|
||
// 在这里处理获取位置信息失败的情况
|
||
}
|
||
|
||
})
|
||
|
||
} else {
|
||
// this.maskepage = 3
|
||
this.buleopen = true
|
||
this.Binddevice()
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
// ；临时锁车
|
||
loackdevice() {
|
||
if (this.OrderdeviceInfos.onlineStatus == 1 && this.backfalse < 1) {
|
||
// uni.showLoading({
|
||
// title: '加载中...'
|
||
// })
|
||
this.$u.post('/appVerify/device/lock?sn=' + this.OrderdeviceInfos.sn + '&orderNo=' + this
|
||
.orderinfo
|
||
.orderNo).then((res) => {
|
||
|
||
if (res.code === 200) {
|
||
// this.getisInOrder()
|
||
this.backfalse = 0
|
||
this.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
this.toploadtxt = '锁车成功';
|
||
this.buleclose = false
|
||
setTimeout(() => {
|
||
this.maskloading = false;
|
||
this.getisInOrder();
|
||
}, 1000);
|
||
} else {
|
||
this.backfalse = this.backfalse + 1
|
||
this.loackdevice()
|
||
// this.toploadtxt = '锁车失败';
|
||
// setTimeout(() => {
|
||
// this.maskloading = false;
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }, 1000);
|
||
|
||
// if (res.msg == '10500-----') {
|
||
// uni.showToast({
|
||
// title: '系统异常，请重新尝试',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// } else {
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }
|
||
|
||
}
|
||
})
|
||
} else if (this.OrderdeviceInfos.onlineStatus == 0 || this.backfalse >= 1) {
|
||
if (this.carstause) {
|
||
|
||
|
||
let that = this
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function(lb) {
|
||
|
||
|
||
let data = {
|
||
latitude: lb.latitude,
|
||
longitude: lb.longitude,
|
||
areaId: that.areaInfo.areaId
|
||
}
|
||
that.$u.post('/appVerify/device/lock?sn=' + that.OrderdeviceInfos
|
||
.sn + '&orderNo=' +
|
||
that
|
||
.orderinfo
|
||
.orderNo + '&isBluetooth=true' + '&lon=' + lb.longitude +
|
||
'&lat=' + lb.latitude).then((res) => {
|
||
|
||
if (res.code === 200) {
|
||
that.closecar()
|
||
// console.log('发送了离线锁车请求');
|
||
// that.getisInOrder()
|
||
that.buleclose = false
|
||
that.backfalse = 0
|
||
that.loadimg =
|
||
'https://lxnapi.ccttiot.com/bike/img/static/ukD735zCS1yQXw2aGun8';
|
||
that.buletxt = '锁车成功';
|
||
that.toploadtxt = '锁车成功'
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
that.getisInOrder();
|
||
}, 1000);
|
||
} else {
|
||
that.toploadtxt = '锁车失败'
|
||
that.buletxt = '锁车失败';
|
||
setTimeout(() => {
|
||
that.maskloading = false;
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}, 1000);
|
||
|
||
|
||
// if (res.msg == '10500-----') {
|
||
// uni.showToast({
|
||
// title: '系统异常，请重新尝试',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// } else {
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// }
|
||
|
||
}
|
||
})
|
||
|
||
},
|
||
fail: function(error) {
|
||
// uni.showToast({
|
||
// title: '未获取到定位信息，请点击设置勾选允许位置信息，即可使用全部功能',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// that.getmarks()
|
||
// 在这里处理获取位置信息失败的情况
|
||
}
|
||
|
||
})
|
||
} else {
|
||
this.buleclose = true
|
||
this.Binddevice()
|
||
// this.maskepage = 3
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
|
||
|
||
|
||
btnyc() {
|
||
this.titleflag = false
|
||
},
|
||
|
||
// 解析自定义数据
|
||
|
||
funListenDeviceMsgEvent: function(options) {
|
||
switch (options.type) {
|
||
case xBlufi.XBLUFI_TYPE.TYPE_GET_DEVICE_LISTS:
|
||
if (options.result) {
|
||
let devicesarr = options.data
|
||
// this.devicesList = options.data
|
||
|
||
devicesarr.forEach(device => {
|
||
|
||
|
||
// this.$u.get(`/app/device/${mac}/isBind`, data).then((res) => {
|
||
// if (res.data == false) {
|
||
this.devicesList.push(device);
|
||
|
||
let uniqueDevicesList = Array.from(new Set(this.devicesList));
|
||
|
||
// 将去重后的数组重新赋值给 this.devicesList
|
||
this.devicesList = uniqueDevicesList;
|
||
|
||
});
|
||
}
|
||
break;
|
||
|
||
case xBlufi.XBLUFI_TYPE.TYPE_CONNECTED:
|
||
console.log("连接回调：" + JSON.stringify(options));
|
||
if (options.result) {
|
||
// uni.hideLoading();
|
||
|
||
|
||
xBlufi.notifyInitBleEsp32({
|
||
deviceId: options.data.deviceId
|
||
});
|
||
|
||
// xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvents);
|
||
|
||
// this.deviceIds = options.data.deviceId
|
||
// this.name = options.data.name
|
||
// 连接成功绑定设备
|
||
// let params = {
|
||
// mac: this.Bluetoothmac,
|
||
// userId: this.$store.state.user.userId
|
||
// }
|
||
let systemInfo = uni.getSystemInfoSync();
|
||
if (systemInfo.platform === 'android') {
|
||
// 当前设备是 Android
|
||
|
||
} else if (systemInfo.platform === 'ios') {
|
||
// 当前设备是 iOS
|
||
// uni.navigateTo({
|
||
// url: '/pages/wifilist/index?deviceId=' + options
|
||
// .data.deviceId + '&name=' + options.data.name
|
||
// })
|
||
}
|
||
}
|
||
if (options.result == false) {
|
||
// this.loadingmask=false
|
||
this.carstause = false
|
||
if (this.maskepage == 4) {
|
||
this.buletxt = '设备连接失败'
|
||
|
||
|
||
setTimeout(() => {
|
||
this.maskepage = 5
|
||
}, 800)
|
||
}
|
||
|
||
// uni.showModal({
|
||
// title: '很抱歉提醒你！',
|
||
// content: '小程序与设备异常断开',
|
||
// showCancel: false,
|
||
// success: function(res) {
|
||
// // uni.navigateBack({
|
||
// // url: '../search/search'
|
||
// // });
|
||
// }
|
||
// });
|
||
// this.statusflag = false
|
||
// uni.hideLoading();
|
||
}
|
||
break;
|
||
case xBlufi.XBLUFI_TYPE.TYPE_RECIEVE_CUSTON_DATA:
|
||
|
||
// this.ver_data = this.parseCustomData(options.data)
|
||
if (options.data) {
|
||
this.carstause = true
|
||
|
||
|
||
if (this.maskloading && this.maskepage == 4) {
|
||
// setTimeout(() => {
|
||
// this.maskloading = false
|
||
// }, 700)
|
||
if (this.buleback == false && this.buleopen == false && this.buleclose == false && this
|
||
.bulebindcar == false) {
|
||
if (this.buletxt == '蓝牙连接中') {
|
||
this.buletxt = '蓝牙连接成功！'
|
||
}
|
||
|
||
}
|
||
if (this.buleclose) {
|
||
this.buleclose = false
|
||
this.loackdevice()
|
||
}
|
||
if (this.buleopen) {
|
||
this.buleopen = false
|
||
this.unloackdevices()
|
||
}
|
||
if (this.buleback) {
|
||
this.buleback = false
|
||
this.cheackgps()
|
||
}
|
||
if (this.bulepayback) {
|
||
this.bulepayback = false
|
||
this.payback()
|
||
}
|
||
if (this.bulebindcar) {
|
||
this.bulebindcar = false
|
||
this.bluesub1()
|
||
}
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
} else {
|
||
this.carstause = false
|
||
if (this.maskepage == 4) {
|
||
this.buletxt = '设备连接失败'
|
||
|
||
|
||
setTimeout(() => {
|
||
this.maskepage = 5
|
||
}, 800)
|
||
}
|
||
}
|
||
console.log("1收到设备发来的自定义数据结果：", options.data);
|
||
break;
|
||
case xBlufi.XBLUFI_TYPE.TYPE_STATUS_CONNECTED: {
|
||
console.log('状态', options.result)
|
||
if (options.result == false) {
|
||
this.carstause = false
|
||
if (this.maskepage == 4) {
|
||
this.buletxt = '设备连接失败'
|
||
|
||
|
||
setTimeout(() => {
|
||
this.maskepage = 5
|
||
}, 800)
|
||
}
|
||
// uni.showToast({
|
||
// title: '设备断开链接，请重新点击蓝牙链接',
|
||
// icon: 'none'
|
||
// });
|
||
// uni.showModal({
|
||
// title: '很抱歉提醒你！',
|
||
// content: '小程序与设备异常断开',
|
||
// showCancel: false,
|
||
// success: function(res) {
|
||
// // uni.navigateBack({
|
||
// // url: '../search/search'
|
||
// // });
|
||
// }
|
||
// });
|
||
// this.statusflag = false
|
||
// uni.hideLoading();
|
||
}
|
||
}
|
||
break;
|
||
case xBlufi.XBLUFI_TYPE.TYPE_GET_DEVICE_LISTS_STOP:
|
||
if (options.result) {
|
||
let uniqueDevicesList = Array.from(new Set(this.devicesList));
|
||
|
||
// 过滤出名称字段的前五个字母为 "CTPOW" 的项
|
||
let filteredDevices = uniqueDevicesList.filter(device => device.name.substring(0,
|
||
4) ===
|
||
"BBLE");
|
||
|
||
// 将过滤后的数组重新赋值给 this.devicesList
|
||
this.devicesList = filteredDevices;
|
||
|
||
// console.log('蓝牙停止搜索ok',this.devicesList);
|
||
} else {
|
||
//蓝牙停止搜索失败
|
||
// console.log('蓝牙停止搜索失败');
|
||
}
|
||
this.searching = false
|
||
// _this.setData({
|
||
// searching: false
|
||
// });
|
||
|
||
break;
|
||
}
|
||
},
|
||
|
||
|
||
//4、建立连接
|
||
createBLEConnection(e) {
|
||
// this.loadingmask = true
|
||
|
||
// uni.showLoading({
|
||
// title: '绑定中..'
|
||
// })
|
||
// console.log('调用了');
|
||
xBlufi.notifyStartDiscoverBle({
|
||
'isStart': false
|
||
});
|
||
// console.log(e, '蓝牙信息')
|
||
const deviceId = e.deviceId
|
||
this.Bluetoothmac = e.localName.substring(5) //从第七位开始截取 只取后面的mac号
|
||
// console.log(this.Bluetoothmac, '11111');
|
||
let name = e.name;
|
||
// console.log('点击了，蓝牙准备连接的deviceId:' + e.deviceId);
|
||
xBlufi.notifyConnectBle({
|
||
isStart: true,
|
||
deviceId: e.deviceId,
|
||
name
|
||
});
|
||
// setTimeout(() => {
|
||
// uni.hideLoading()
|
||
// }, 3000)
|
||
// for (var i = 0; i < this.devicesList.length; i++) {
|
||
// if (e.deviceId === this.devicesList[i].deviceId) {
|
||
|
||
// uni.showLoading({
|
||
// title: '连接蓝牙设备中...'
|
||
// });
|
||
// }
|
||
// }
|
||
},
|
||
|
||
|
||
starTime() {
|
||
uni.hideLoading()
|
||
this.showtcs = false
|
||
this.seeDetail = false
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
if (this.orderinfo.sn) {
|
||
this.$u.get('/app/device/info?sn=' + this.orderinfo.sn).then((res) => {
|
||
if (res.code === 200) {
|
||
this.OrderdeviceInfos = res.data
|
||
// this.OrderdeviceInfos.onlineStatus = '1'
|
||
this.mac = this.OrderdeviceInfos.mac
|
||
if (this.OrderdeviceInfos.onlineStatus == 0 && this.orderinfo.status != 3) {
|
||
|
||
if (this.carstause == false) {
|
||
|
||
// this.isnoline = true
|
||
}
|
||
|
||
}
|
||
|
||
|
||
} else {
|
||
// 处理接口返回错误的情况
|
||
}
|
||
}).catch(error => {
|
||
// 处理接口请求失败的情况
|
||
});
|
||
}
|
||
|
||
|
||
|
||
// 预约中
|
||
if (this.orderinfo.status == 0) {
|
||
this.showdevice = true
|
||
this.deviceIndex = 2
|
||
const createTimeTimestamp = new Date(this.orderinfo.createTime).getTime();
|
||
|
||
// 定义定时器
|
||
this.timer = setInterval(() => {
|
||
const currentTime = Date.now();
|
||
const timePassed = currentTime - createTimeTimestamp;
|
||
const secondsPassed = Math.floor(timePassed / 1000);
|
||
|
||
// 转换为时分秒格式
|
||
const hours = Math.floor(secondsPassed / 3600);
|
||
const minutes = Math.floor((secondsPassed % 3600) / 60);
|
||
const seconds = secondsPassed % 60;
|
||
const timeString =
|
||
`${hours < 10 ? '0' : ''}${hours}:${minutes < 10 ? '0' : ''}${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;
|
||
const totalMinutes = hours * 60 + minutes;
|
||
const tenMinuteIntervals = Math.floor(totalMinutes / 10) + 1;
|
||
this.money = tenMinuteIntervals * parseFloat(this.areaInfo.appointmentServiceFee)
|
||
|
||
// 每隔十分钟增加费用
|
||
if (minutes % 10 === 0 && seconds === 0) {
|
||
|
||
}
|
||
this.timeString = timeString
|
||
// console.log("已经过去了：" + timeString);
|
||
}, 1000);
|
||
} else if (this.orderinfo.status == 1) {
|
||
// 取消预约
|
||
// this.topay()
|
||
const createTimeTimestamp = new Date(this.orderinfo.appointmentStartTime).getTime();
|
||
|
||
// 定义定时器
|
||
|
||
const currentTime = new Date(this.orderinfo.appointmentEndTime).getTime();;
|
||
const timePassed = currentTime - createTimeTimestamp;
|
||
const secondsPassed = Math.floor(timePassed / 1000);
|
||
|
||
// 转换为时分秒格式
|
||
const hours = Math.floor(secondsPassed / 3600);
|
||
const minutes = Math.floor((secondsPassed % 3600) / 60);
|
||
const seconds = secondsPassed % 60;
|
||
const timeString =
|
||
`${hours < 10 ? '0' : ''}${hours}:${minutes < 10 ? '0' : ''}${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;
|
||
const totalMinutes = hours * 60 + minutes;
|
||
const tenMinuteIntervals = Math.floor(totalMinutes / 10) + 1;
|
||
|
||
this.timeString = timeString
|
||
// console.log("已经过去了：" + timeString);
|
||
|
||
this.showdevice = true
|
||
this.deviceIndex = 3
|
||
} else if (this.orderinfo.status == 2) {
|
||
// 开始骑行
|
||
// this.topay()
|
||
this.showdevice = true
|
||
this.deviceIndex = 2
|
||
const createTimeTimestamp = new Date(this.orderinfo.unlockTime).getTime();
|
||
|
||
// 定义定时器
|
||
this.timer = setInterval(() => {
|
||
const currentTime = Date.now();
|
||
const timePassed = currentTime - createTimeTimestamp;
|
||
const secondsPassed = Math.floor(timePassed / 1000);
|
||
|
||
// 转换为时分秒格式
|
||
const hours = Math.floor(secondsPassed / 3600);
|
||
const minutes = Math.floor((secondsPassed % 3600) / 60);
|
||
const seconds = secondsPassed % 60;
|
||
const timeString =
|
||
`${hours < 10 ? '0' : ''}${hours}:${minutes < 10 ? '0' : ''}${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;
|
||
let totalMinutes = hours * 60 + minutes;
|
||
|
||
let totalTime;
|
||
if (this.orderinfo.rule.rentalUnit === 'minutes') {
|
||
totalTime = totalMinutes;
|
||
} else if (this.orderinfo.rule.rentalUnit === 'hours') {
|
||
totalTime = hours + minutes / 60;
|
||
} else if (this.orderinfo.rule.rentalUnit === 'day') {
|
||
totalTime = hours / 24 + minutes / 1440;
|
||
}
|
||
|
||
// 计费规则计算
|
||
if (this.orderinfo.rule.ridingRule == 1) {
|
||
const ridingRuleJson = JSON.parse(this.orderinfo.rule.ridingRuleJson);
|
||
const timeoutTime = parseFloat(ridingRuleJson.timeoutTime);
|
||
const startingPrice = parseFloat(ridingRuleJson.startingPrice);
|
||
const startingTime = parseFloat(ridingRuleJson.startingTime);
|
||
const timeoutPrice = parseFloat(ridingRuleJson.timeoutPrice);
|
||
|
||
let totalCharge;
|
||
if (totalTime <= startingTime) {
|
||
totalCharge = startingPrice;
|
||
} else {
|
||
const extraTime = totalTime - startingTime;
|
||
const extraCharge = Math.ceil(extraTime / timeoutTime) * timeoutPrice;
|
||
totalCharge = startingPrice + extraCharge;
|
||
}
|
||
|
||
// 更新money值
|
||
this.money = totalCharge + this.orderinfo.appointmentFee
|
||
} else if (this.orderinfo.rule.ridingRule == 2) {
|
||
const ridingRuleJson = JSON.parse(this.orderinfo.rule.ridingRuleJson);
|
||
const rules = ridingRuleJson.rule;
|
||
let totalCharge = 0;
|
||
|
||
for (let rule of rules) {
|
||
const start = parseFloat(rule.start);
|
||
const end = parseFloat(rule.end);
|
||
const eachUnit = parseFloat(rule.eachUnit);
|
||
const fee = parseFloat(rule.fee);
|
||
|
||
if (totalTime > start && (end === 9999 || totalTime <= end)) {
|
||
// 所有时间都按照该区间的费率来计算
|
||
totalCharge = Math.ceil(totalTime / eachUnit) * fee;
|
||
break;
|
||
}
|
||
}
|
||
|
||
// 更新money值
|
||
this.money = totalCharge + this.orderinfo.appointmentFee
|
||
}
|
||
|
||
// 更新时间字符串
|
||
this.timeString = timeString;
|
||
}, 1000);
|
||
} else if (this.orderinfo.status == 3) {
|
||
// 骑行结束
|
||
// this.topay()
|
||
const createTimeTimestamp = new Date(this.orderinfo.createTime).getTime();
|
||
|
||
// 定义定时器
|
||
const currentTime = new Date(this.orderinfo.returnTime).getTime();;
|
||
// const currentTime = Date.now();
|
||
const timePassed = currentTime - createTimeTimestamp;
|
||
const secondsPassed = Math.floor(timePassed / 1000);
|
||
|
||
// 转换为时分秒格式
|
||
const hours = Math.floor(secondsPassed / 3600);
|
||
const minutes = Math.floor((secondsPassed % 3600) / 60);
|
||
const seconds = secondsPassed % 60;
|
||
const timeString =
|
||
`${hours < 10 ? '0' : ''}${hours}:${minutes < 10 ? '0' : ''}${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;
|
||
const tenMinuteIntervals = Math.floor((hours * 60 + minutes) / 10) + 1; // 加1是因为不满十分钟也算一个十分钟
|
||
|
||
this.timeString = timeString
|
||
// console.log("已经过去了：" + timeString);
|
||
|
||
this.showdevice = true
|
||
this.deviceIndex = 3
|
||
}
|
||
|
||
|
||
|
||
// 将 createTime 转换为时间戳
|
||
|
||
},
|
||
startCountdown() {
|
||
console.log('调用了');
|
||
const interval = setInterval(() => {
|
||
if (this.countdown > 0) {
|
||
this.countdown--;
|
||
} else {
|
||
clearInterval(interval);
|
||
}
|
||
}, 1000);
|
||
},
|
||
toxy() {
|
||
this.seeDetail = true
|
||
uni.navigateTo({
|
||
url: '/page_user/agreement'
|
||
})
|
||
},
|
||
|
||
// lockDevice() {
|
||
// if (this.orderinfo.status) {
|
||
// this.showtcs = true
|
||
// } else {
|
||
// if (this.deviceInfos.status != 1) {
|
||
// uni.showToast({
|
||
// title: '车辆正在使用中,请使用其他车辆',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
// } else {
|
||
// this.showdevice = true;
|
||
// this.type = 1;
|
||
// this.deviceIndex = 1;
|
||
// }
|
||
// }
|
||
|
||
// },
|
||
changetips() {
|
||
if (this.countdown <= 0) {
|
||
if (this.showTips) {
|
||
|
||
uni.setStorageSync('hasShownPopup', false);
|
||
this.showTips = uni.getStorageSync('hasShownPopup')
|
||
} else {
|
||
uni.setStorageSync('hasShownPopup', true);
|
||
this.showTips = uni.getStorageSync('hasShownPopup')
|
||
}
|
||
|
||
}
|
||
|
||
},
|
||
|
||
getMyLocation() {
|
||
uni.createMapContext("map", this).moveToLocation({
|
||
longitude: this.longitude,
|
||
latitude: this.latitude,
|
||
});
|
||
},
|
||
async setMapScale(e, val) {
|
||
console.log('调用了校验');
|
||
let mapContext = uni.createMapContext('map', this);
|
||
let setScale = () => {
|
||
return new Promise((resolve, reject) => {
|
||
mapContext.getScale({
|
||
success: r => {
|
||
resolve()
|
||
}
|
||
})
|
||
})
|
||
};
|
||
await setScale();
|
||
mapContext.moveToLocation({
|
||
success: (res) => {
|
||
const timer = setTimeout(() => {
|
||
clearTimeout(timer);
|
||
}, 500);
|
||
},
|
||
})
|
||
},
|
||
// 查看费用详情
|
||
tofeeDetail() {
|
||
uni.navigateTo({
|
||
url: '/page_user/ckmx?orderId=' + this.orderinfo.orderNo
|
||
})
|
||
},
|
||
// 扫码开锁
|
||
qecodelock() {
|
||
if (this.orderinfo.status) {
|
||
this.showtcs = true
|
||
} else {
|
||
this.seeDetail = true
|
||
uni.scanCode({
|
||
onlyFromCamera: true,
|
||
scanType: ['qrCode'],
|
||
success: res => {
|
||
|
||
let sn = null;
|
||
let queryParams = res.result.split('?')[1];
|
||
if (queryParams) {
|
||
let params = queryParams.split('&');
|
||
params.forEach(param => {
|
||
let [key, value] = param.split('=');
|
||
if (key === 'sn') {
|
||
sn = value;
|
||
}
|
||
});
|
||
}
|
||
|
||
this.sn = sn
|
||
if (this.sn != '') {
|
||
setTimeout(() => {
|
||
if (!this.orderinfo.status) {
|
||
this.deviceInfo(1)
|
||
|
||
}
|
||
}, 500)
|
||
|
||
}
|
||
|
||
},
|
||
fail: err => {
|
||
// console.error('扫描失败：', err);
|
||
// uni.showToast({
|
||
// title: '扫描失败',
|
||
// icon: 'none'
|
||
// });
|
||
}
|
||
});
|
||
}
|
||
|
||
},
|
||
feedetail(item, index) {
|
||
this.freeInfo = item
|
||
this.seeDetail = true
|
||
try {
|
||
const itemStr = encodeURIComponent(JSON.stringify(item));
|
||
uni.navigateTo({
|
||
url: `/page_user/jfgz?item=${itemStr}`
|
||
});
|
||
} catch (error) {
|
||
console.error('Error serializing item:', error);
|
||
}
|
||
// this.showfeeDetail = true
|
||
this.freeListIndex = index
|
||
},
|
||
// 无套餐取消预约
|
||
|
||
// 套餐取消预约
|
||
|
||
|
||
// 套餐直接开锁
|
||
sub6() {
|
||
if (this.orderinfo.ruleId) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
|
||
// ruleId: this.freeInfo.ruleId,
|
||
// money: this.freeInfo.fee,
|
||
mark: "套餐直接开锁",
|
||
// type: '1',
|
||
ruleId: this.orderinfo.ruleId,
|
||
orderNo: this.orderinfo.orderNo
|
||
|
||
}
|
||
this.$u.post('/appVerify/device/snSwitch', data).then((res) => {
|
||
if (res.code === 200) {
|
||
this.getisInOrder()
|
||
} else {
|
||
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
},
|
||
// 预约解锁骑行
|
||
unlockdevice() {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
if (this.orderinfo.ruleId == null) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.orderinfo.sn,
|
||
|
||
// ruleId: this.freeInfo.ruleId,
|
||
// money: this.freeInfo.fee,
|
||
mark: "预约开锁",
|
||
// type: '1',
|
||
orderNo: this.orderinfo.orderNo
|
||
|
||
}
|
||
this.$u.post('/appVerify/device/snSwitch', data).then((res) => {
|
||
uni.hideLoading()
|
||
if (res.code == 200) {
|
||
|
||
this.getisInOrder()
|
||
} else {
|
||
this.getisInOrder()
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
} else {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.orderinfo.sn,
|
||
|
||
// ruleId: this.freeInfo.ruleId,
|
||
// money: this.freeInfo.fee,
|
||
mark: "套餐预约开锁",
|
||
// type: '1',
|
||
ruleId: this.orderinfo.ruleId,
|
||
orderNo: this.orderinfo.orderNo
|
||
|
||
}
|
||
this.$u.post('/appVerify/device/snSwitch', data).then((res) => {
|
||
uni.hideLoading()
|
||
if (res.code === 200) {
|
||
this.getisInOrder()
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
}
|
||
|
||
},
|
||
lockDevice() {
|
||
if (this.orderinfo.status) {
|
||
this.showtcs = true
|
||
} else {
|
||
if (this.deviceInfos.status != 1) {
|
||
uni.showToast({
|
||
title: '车辆正在使用中,请使用其他车辆',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
} else {
|
||
this.showdevice = true;
|
||
this.type = 1;
|
||
this.deviceIndex = 1;
|
||
}
|
||
}
|
||
|
||
},
|
||
|
||
// 取消预约支付
|
||
topay() {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.orderinfo.sn,
|
||
orderNo: this.orderinfo.orderNo,
|
||
|
||
// money: this.freeInfo.fee,
|
||
mark: "订单支付",
|
||
type: '2'
|
||
|
||
|
||
}
|
||
uni.showLoading({
|
||
|
||
})
|
||
console.log('点击了');
|
||
let that = this
|
||
this.$u.post('/appVerify/pre/order', data).then((res) => {
|
||
if (res.code === 200) {
|
||
uni.hideLoading()
|
||
// this.freList=res.rows
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.packageVal,
|
||
signType: res.data.signType,
|
||
paySign: res.data.paySign,
|
||
success(res) {
|
||
// 支付成功逻辑
|
||
that.getisInOrder()
|
||
|
||
},
|
||
fail(err) {
|
||
// 支付失败逻辑
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
},
|
||
// 骑行结束支付
|
||
topay1() {
|
||
if (this.ispaid == false) {
|
||
uni.showLoading({
|
||
|
||
})
|
||
this.ispaid = true
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.orderinfo.sn,
|
||
orderNo: this.orderinfo.orderNo,
|
||
|
||
// money: this.freeInfo.fee,
|
||
mark: "订单支付",
|
||
type: '1'
|
||
|
||
|
||
}
|
||
|
||
console.log('点击了',this.ispaid );
|
||
let that = this
|
||
this.$u.post('/appVerify/pre/order', data).then((res) => {
|
||
if (res.code === 200) {
|
||
uni.hideLoading()
|
||
// this.freList=res.rows
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.packageVal,
|
||
signType: res.data.signType,
|
||
paySign: res.data.paySign,
|
||
success(res) {
|
||
that.ispaid = false
|
||
console.log('支付成功');
|
||
// 支付成功逻辑
|
||
clearInterval(that.timer)
|
||
that.orderinfo = {}
|
||
that.showdevice = false
|
||
that.deviceIndex = 0
|
||
that.getisInOrder()
|
||
|
||
},
|
||
fail(err) {
|
||
that.closePay()
|
||
that.ispaid = false
|
||
// 支付失败逻辑
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
that.ispaid = false
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
},
|
||
closePay(){
|
||
|
||
this.$u.post('/appVerify/order/unlockOrder?orderNo='+ this.orderinfo.orderNo).then((res) => {
|
||
if (res.code === 200) {
|
||
// this.freList=res.rows
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
},
|
||
|
||
sub5() {
|
||
if (this.orderinfo.ruleId) {
|
||
this.$u.post('/appVerify/device/appointment?userId=' + this.userId + '&sn=' + this.sn +
|
||
'&ruleId=' +
|
||
this
|
||
.orderinfo.ruleId + '&type=2' + '&orderNo=' + this.orderinfo.orderNo).then((
|
||
res) => {
|
||
if (res.code === 200) {
|
||
uni.showLoading({
|
||
title: '预约中...'
|
||
})
|
||
setTimeout(() => {
|
||
this.getisInOrder()
|
||
uni.hideLoading()
|
||
}, 1000)
|
||
// this.freList=res.rows
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
},
|
||
|
||
|
||
// 开锁购买套餐
|
||
sub2() {
|
||
if (this.freeInfo.ruleId) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
// money: this.freeInfo.fee,
|
||
isAppointment: false,
|
||
mark: "套餐开锁",
|
||
type: '3'
|
||
|
||
|
||
}
|
||
this.$u.post('/appVerify/pre/order', data).then((res) => {
|
||
if (res.code === 200) {
|
||
// this.freList=res.rows
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.packageVal,
|
||
signType: res.data.signType,
|
||
paySign: res.data.paySign,
|
||
success(res) {
|
||
// 支付成功逻辑
|
||
this.showdevice = false
|
||
this.deviceIndex = 0
|
||
this.mac = ''
|
||
this.type = 0
|
||
this.freeInfo = {}
|
||
this.freeListIndex = 0
|
||
this.getisInOrder()
|
||
},
|
||
fail(err) {
|
||
// 支付失败逻辑
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
},
|
||
// 确认预约
|
||
sub3() {
|
||
if (this.showxy) {
|
||
if (this.areaInfo.authentication == 1) {
|
||
if (this.userinfo.isAuthentication == 0) {
|
||
this.seeDetail = true
|
||
uni.navigateTo({
|
||
url: "/page_user/idcard_test"
|
||
})
|
||
} else {
|
||
if (this.freeInfo.ruleId) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
// isAppointment: true,
|
||
// money: this.freeInfo.fee,
|
||
mark: "预约购买套餐",
|
||
type: '2'
|
||
|
||
|
||
}
|
||
this.$u.post('/appVerify/device/appointment?userId=' + this.userId + '&sn=' +
|
||
this.sn +
|
||
'&ruleId=' +
|
||
this
|
||
.freeInfo.ruleId).then((res) => {
|
||
this.seeDetail = false
|
||
if (res.code === 200) {
|
||
uni.showLoading({
|
||
title: '预约中...'
|
||
})
|
||
setTimeout(() => {
|
||
this.getisInOrder()
|
||
uni.hideLoading()
|
||
}, 1000)
|
||
// this.freList=res.rows
|
||
|
||
} else {
|
||
|
||
|
||
if (res.msg == '您还未充值押金，请先充值押金') {
|
||
|
||
this.close()
|
||
this.showYjTip = true
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
}
|
||
} else {
|
||
if (this.freeInfo.ruleId) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
// isAppointment: true,
|
||
// money: this.freeInfo.fee,
|
||
mark: "预约购买套餐",
|
||
type: '2'
|
||
|
||
|
||
}
|
||
this.$u.post('/appVerify/device/appointment?userId=' + this.userId + '&sn=' + this
|
||
.sn +
|
||
'&ruleId=' +
|
||
this
|
||
.freeInfo.ruleId).then((res) => {
|
||
this.seeDetail = false
|
||
if (res.code === 200) {
|
||
uni.showLoading({
|
||
title: '预约中...'
|
||
})
|
||
setTimeout(() => {
|
||
this.getisInOrder()
|
||
uni.hideLoading()
|
||
}, 1000)
|
||
// this.freList=res.rows
|
||
|
||
} else {
|
||
|
||
if (res.msg == '您还未充值押金，请先充值押金') {
|
||
this.close()
|
||
this.showYjTip = true
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
}
|
||
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: '请勾选协议',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
|
||
|
||
},
|
||
// 预约购买套餐
|
||
sub4() {
|
||
if (this.freeInfo.ruleId) {
|
||
let data = {
|
||
userId: this.userId,
|
||
sn: this.sn,
|
||
ruleId: this.freeInfo.ruleId,
|
||
isAppointment: true,
|
||
// money: this.freeInfo.fee,
|
||
mark: "预约购买套餐",
|
||
type: '3'
|
||
|
||
|
||
}
|
||
console.log('点击了');
|
||
this.$u.post('/appVerify/pre/order', data).then((res) => {
|
||
if (res.code === 200) {
|
||
// this.freList=res.rows
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: res.data.timeStamp,
|
||
nonceStr: res.data.nonceStr,
|
||
package: res.data.packageVal,
|
||
signType: res.data.signType,
|
||
paySign: res.data.paySign,
|
||
success(res) {
|
||
// 支付成功逻辑
|
||
|
||
this.showdevice = false
|
||
this.deviceIndex = 0
|
||
this.mac = ''
|
||
this.type = 0
|
||
this.freeInfo = {}
|
||
this.freeListIndex = 0
|
||
this.getisInOrder()
|
||
},
|
||
fail(err) {
|
||
// 支付失败逻辑
|
||
uni.showToast({
|
||
title: '支付失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
title: '请选择套餐',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
|
||
},
|
||
getisInOrder() {
|
||
// uni.showLoading({
|
||
|
||
// })
|
||
this.orderinfo = {}
|
||
if (this.userId) {
|
||
this.$u.post('/app/user/isInOrder?userId=' + this.userId, ).then((res) => {
|
||
// uni.hideLoading()
|
||
if (res.code === 200) {
|
||
// this.freList=res.rows
|
||
if (res.data != '') {
|
||
this.orderinfo = res.data[0]
|
||
if (this.orderinfo.status == 4) {
|
||
this.getisInOrder()
|
||
} else {
|
||
clearInterval(this.timer)
|
||
this.starTime()
|
||
}
|
||
if (this.areaInfo.areaId != res.data[0].areaId && this.orderinfo.sn != '') {
|
||
this.isqrcode = true
|
||
this.getArea()
|
||
}
|
||
|
||
} else {
|
||
clearInterval(this.timer)
|
||
if(this.orderinfo.sn){
|
||
this.orderinfo = {}
|
||
this.showdevice = false
|
||
this.deviceIndex = 0
|
||
}
|
||
|
||
}
|
||
} else {
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
},
|
||
changefree(item, index) {
|
||
this.freeInfo = item
|
||
this.freeListIndex = index
|
||
|
||
},
|
||
getlist() {
|
||
this.freList = []
|
||
let data = {
|
||
areaId: this.areaInfo.areaId
|
||
}
|
||
this.$u.get('/app/fee/list?', data).then((res) => {
|
||
if (res.code === 200) {
|
||
this.freList = res.data.map(item => {
|
||
try {
|
||
item.ridingRuleJson = JSON.parse(item.ridingRuleJson);
|
||
} catch (e) {
|
||
console.error('Invalid JSON in ridingRuleJson:', item
|
||
.ridingRuleJson);
|
||
}
|
||
return item;
|
||
});
|
||
this.freeInfo = this.freList[0]
|
||
this.freeListIndex = 1
|
||
console.log(this.freList, this.freeInfo, ' this.freList this.freList');
|
||
// setTimeout(()=>{
|
||
|
||
// console.log(this.freeListIndex,'this.freeListIndexthis.freeListIndexthis.freeListIndex');
|
||
// },300)
|
||
|
||
|
||
} else {
|
||
uni.showToast({
|
||
title: '未登录，请登录后尝试',
|
||
icon: 'none',
|
||
duration: 1000
|
||
});
|
||
}
|
||
})
|
||
},
|
||
// 发现坏车
|
||
|
||
// 预约车辆
|
||
Reserve() {
|
||
if (this.orderinfo.status) {
|
||
this.showtcs = true
|
||
} else {
|
||
if (this.$store.getters.userId == undefined) {
|
||
// this.$u.get("/getAppInfo").then((res) => {
|
||
// console.log('进入跳转');
|
||
// if(res.code==200){
|
||
// this.$store.commit('SET_USERID', res.user.userId);
|
||
|
||
// }
|
||
// });
|
||
this.$store.dispatch('userInfo', this.$u).then(() => {
|
||
this.deviceIndex = 1
|
||
this.type = 2
|
||
console.log(this.$store.getters.userId,
|
||
'this.$store.getters.userIdthis.$store.getters.userId');
|
||
// 执行其他操作...
|
||
});
|
||
} else {
|
||
this.deviceIndex = 1
|
||
this.type = 2
|
||
}
|
||
}
|
||
|
||
|
||
|
||
},
|
||
|
||
// 关闭弹出
|
||
close() {
|
||
this.showdevice = false
|
||
this.deviceIndex = 0
|
||
// this.sn = ''
|
||
this.type = 0
|
||
this.freeInfo = {}
|
||
this.freeListIndex = 0
|
||
},
|
||
// 扫码的方法
|
||
scanQRCode() {
|
||
uni.scanCode({
|
||
onlyFromCamera: true,
|
||
scanType: ['qrCode'],
|
||
success: res => {
|
||
console.log('扫描结果：', res);
|
||
this.sn = res.sn
|
||
this.type = 1
|
||
},
|
||
fail: err => {
|
||
console.error('扫描失败：', err);
|
||
uni.showToast({
|
||
title: '扫描失败',
|
||
icon: 'none'
|
||
});
|
||
}
|
||
});
|
||
},
|
||
findBike() {
|
||
uni.showLoading({
|
||
|
||
})
|
||
// uni.showToast({
|
||
// title: '响铃请求发送成功',
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// });
|
||
this.$u.post('/app/device/ring?sn=' + this.sn).then((res) => {
|
||
if (res.code === 200) {
|
||
uni.hideLoading()
|
||
}
|
||
})
|
||
},
|
||
|
||
isMarkersChanged(newMarkers) {
|
||
if (this.oldMarkers.length !== newMarkers.length) {
|
||
return true;
|
||
}
|
||
|
||
for (let i = 0; i < newMarkers.length; i++) {
|
||
if (this.oldMarkers[i].id !== newMarkers[i].id ||
|
||
this.oldMarkers[i].latitude !== newMarkers[i].latitude ||
|
||
this.oldMarkers[i].longitude !== newMarkers[i].longitude) {
|
||
return true;
|
||
}
|
||
}
|
||
|
||
return false;
|
||
},
|
||
getinfo() {
|
||
if (uni.getStorageSync('token')) {
|
||
this.$u.get("/getAppInfo").then((res) => {
|
||
|
||
if (res.code == 200) {
|
||
this.$store.commit('SET_USERID', res.user.userId);
|
||
this.userinfo = res.user
|
||
|
||
} else {
|
||
// setTimeout(() => {
|
||
// this.getinfo()
|
||
// }, 200)
|
||
|
||
}
|
||
});
|
||
|
||
|
||
|
||
}
|
||
},
|
||
getSNFromQRCode(url) {
|
||
// 解码URL
|
||
|
||
let decodedUrl = decodeURIComponent(url);
|
||
|
||
// 使用正则表达式提取sn参数
|
||
let snMatch = decodedUrl.match(/[\?&]sn=([^&#]*)/);
|
||
if (snMatch) {
|
||
return snMatch[1];
|
||
} else {
|
||
return null;
|
||
}
|
||
},
|
||
|
||
|
||
convertBoundaryToPolyline(boundary) {
|
||
if (!boundary) return null;
|
||
|
||
const points = JSON.parse(boundary).map(coord => ({
|
||
latitude: coord[1],
|
||
longitude: coord[0]
|
||
}));
|
||
|
||
const polyline = {
|
||
points: points,
|
||
fillColor: "#55888840", //填充颜色
|
||
strokeColor: "#22FF00", //描边颜色
|
||
strokeWidth: 2, //描边宽度
|
||
zIndex: 1, //层级
|
||
};
|
||
|
||
return polyline;
|
||
},
|
||
convertBoundaryToPolylines(boundaries, num) {
|
||
if (num == 1) {
|
||
console.log('判断1');
|
||
return boundaries.map(boundary => {
|
||
if (!boundary) return null;
|
||
let coords;
|
||
try {
|
||
coords = JSON.parse(boundary);
|
||
} catch (error) {
|
||
console.error("Error parsing boundary JSON:", error);
|
||
return null;
|
||
}
|
||
if (!Array.isArray(coords)) {
|
||
console.error("Parsed boundary is not an array:", coords);
|
||
return null;
|
||
}
|
||
const points = coords.map(coord => ({
|
||
latitude: coord[1],
|
||
longitude: coord[0]
|
||
}));
|
||
return {
|
||
points: points,
|
||
fillColor: "#3A7EDB40", //填充颜色
|
||
strokeColor: "#3A7EDB", //描边颜色
|
||
strokeWidth: 2, //描边宽度
|
||
zIndex: 1, //层级
|
||
|
||
};
|
||
}).filter(polyline => polyline !== null); // 过滤掉无效的折线数据
|
||
} else if (num == 2) {
|
||
return boundaries.map(boundary => {
|
||
if (!boundary) return null;
|
||
let coords;
|
||
try {
|
||
coords = JSON.parse(boundary);
|
||
} catch (error) {
|
||
console.error("Error parsing boundary JSON:", error);
|
||
return null;
|
||
}
|
||
if (!Array.isArray(coords)) {
|
||
console.error("Parsed boundary is not an array:", coords);
|
||
return null;
|
||
}
|
||
const points = coords.map(coord => ({
|
||
latitude: coord[1],
|
||
longitude: coord[0]
|
||
}));
|
||
return {
|
||
points: points,
|
||
fillColor: "#FFF5D640", //填充颜色
|
||
strokeColor: "#FFC107", //描边颜色
|
||
strokeWidth: 2, //描边宽度
|
||
zIndex: 1, //层级
|
||
|
||
};
|
||
}).filter(polyline => polyline !== null); // 过滤掉无效的折线数据
|
||
} else if (num == 3) {
|
||
return boundaries.map(boundary => {
|
||
if (!boundary) return null;
|
||
let coords;
|
||
try {
|
||
coords = JSON.parse(boundary);
|
||
} catch (error) {
|
||
console.error("Error parsing boundary JSON:", error);
|
||
return null;
|
||
}
|
||
if (!Array.isArray(coords)) {
|
||
console.error("Parsed boundary is not an array:", coords);
|
||
return null;
|
||
}
|
||
const points = coords.map(coord => ({
|
||
latitude: coord[1],
|
||
longitude: coord[0]
|
||
}));
|
||
return {
|
||
points: points,
|
||
fillColor: "#FFD1CF40", //填充颜色
|
||
strokeColor: "#FF473E", //描边颜色
|
||
strokeWidth: 2, //描边宽度
|
||
zIndex: 1, //层级
|
||
|
||
};
|
||
}).filter(polyline => polyline !== null); // 过滤掉无效的折线数据
|
||
}
|
||
|
||
},
|
||
topage(num) {
|
||
if (num == 0) {
|
||
// uni.navigateTo({
|
||
// url:''
|
||
// })
|
||
} else if (num == 1) {
|
||
|
||
this.maskloading = false
|
||
if (uni.getStorageSync('token')) {
|
||
if (this.areaInfo.authentication == 1) {
|
||
this.$u.get("/getAppInfo").then(res => {
|
||
|
||
if (res.code == 200) {
|
||
this.userinfo = res.user;
|
||
this.$store.commit('SET_USERID', res.user.userId);
|
||
if (res.user.isAuthentication == 0) {
|
||
uni.hideLoading()
|
||
this.seeDetail = true;
|
||
uni.navigateTo({
|
||
url: "/page_user/idcard_test"
|
||
});
|
||
} else {
|
||
this.tozf=true
|
||
this.seeDetail = true;
|
||
uni.hideLoading()
|
||
console.log('跳转1');
|
||
uni.navigateTo({
|
||
url: '/page_user/yj?isback=' + this.showYjTip
|
||
});
|
||
this.showYjTip = false
|
||
}
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '未登录，请登录后尝试',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
this.seeDetail = true;
|
||
this.tozf=true
|
||
uni.hideLoading()
|
||
console.log('跳转2');
|
||
uni.navigateTo({
|
||
url: '/page_user/yj?isback=' + this.showYjTip
|
||
});
|
||
this.showYjTip = false
|
||
}
|
||
|
||
|
||
} else {
|
||
|
||
let that = this;
|
||
wx.login({
|
||
success(res) {
|
||
if (res.code) {
|
||
console.log('登录成功！', res);
|
||
let areaId = uni.getStorageSync('areaId');
|
||
uni.showLoading({
|
||
title: '登录中...'
|
||
});
|
||
that.$u.post('/loginByopenid?jsCode=' + res.code + '&areaId=' +
|
||
areaId)
|
||
.then(res => {
|
||
uni.hideLoading();
|
||
if (res.code == 200) {
|
||
uni.setStorageSync('token', res.token);
|
||
if (that.areaInfo.authentication == 1) {
|
||
that.$u.get("/getAppInfo").then(res => {
|
||
if (res.code == 200) {
|
||
that.userinfo = res.user;
|
||
that.$store.commit(
|
||
'SET_USERID', res
|
||
.user.userId);
|
||
if (res.user
|
||
.isAuthentication == 0) {
|
||
uni.hideLoading()
|
||
that.seeDetail = true;
|
||
that.tozf=true
|
||
uni.navigateTo({
|
||
url: "/page_user/idcard_test"
|
||
});
|
||
} else {
|
||
that.seeDetail = true;
|
||
that.tozf=true
|
||
uni.hideLoading()
|
||
console.log('跳转3');
|
||
uni.navigateTo({
|
||
url: '/page_user/yj?isback=' +
|
||
that
|
||
.showYjTip
|
||
});
|
||
that.showYjTip = false
|
||
}
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '未登录，请登录后尝试',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
that.tozf=true
|
||
that.seeDetail = true;
|
||
uni.hideLoading()
|
||
console.log('跳转4');
|
||
uni.navigateTo({
|
||
url: '/page_user/yj?isback=' + that
|
||
.showYjTip
|
||
});
|
||
that.showYjTip = false
|
||
}
|
||
} else if (res.code == 501) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.redirectTo({
|
||
url: '/pages/login/login'
|
||
});
|
||
}
|
||
}).catch(err => {
|
||
uni.hideLoading();
|
||
uni.showToast({
|
||
title: '请求失败，请稍后重试',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
console.error('请求失败：', err);
|
||
});
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '登录失败，请重试',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
console.error('微信登录失败：', res);
|
||
}
|
||
},
|
||
fail(err) {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '微信登录接口调用失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
console.error('微信登录接口调用失败：', err);
|
||
}
|
||
});
|
||
|
||
|
||
this.showYjTip = false
|
||
|
||
}
|
||
|
||
} else if (num == 2) {
|
||
uni.navigateTo({
|
||
url: '/page_user/jfgz'
|
||
})
|
||
} else if (num == 3) {
|
||
uni.navigateTo({
|
||
url: '/page_user/yczn'
|
||
})
|
||
} else if (num == 4) {
|
||
if (this.orderinfo.status) {
|
||
this.showtcs = true
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/page_user/bhks'
|
||
})
|
||
}
|
||
|
||
} else if (num == 5) {
|
||
|
||
uni.navigateTo({
|
||
url: '/page_user/gzsb'
|
||
})
|
||
} else if (num == 6) {
|
||
// console.log('点击了');
|
||
this.sn = ''
|
||
uni.navigateTo({
|
||
url: '/pages/my'
|
||
})
|
||
|
||
} else if (num == 7) {
|
||
uni.navigateTo({
|
||
url: '/page_user/gzsb?sn=' + this.sn
|
||
})
|
||
} else if (num == 8) {
|
||
uni.navigateTo({
|
||
url: '/page_user/gzsb?sn=' + this.sn
|
||
})
|
||
} else if (num == 9) {
|
||
uni.navigateTo({
|
||
url: '/page_user/khfw/khfw'
|
||
})
|
||
}
|
||
},
|
||
|
||
|
||
|
||
},
|
||
|
||
}
|
||
</script>
|
||
<style>
|
||
.uni-margin-wrap {
|
||
width: 690rpx;
|
||
width: 100%;
|
||
}
|
||
|
||
.swiper {
|
||
height: 300rpx;
|
||
}
|
||
|
||
.swiper-item {
|
||
display: block;
|
||
height: 300rpx;
|
||
line-height: 300rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.swiper-list {
|
||
margin-top: 40rpx;
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.uni-common-mt {
|
||
margin-top: 60rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.info {
|
||
position: absolute;
|
||
right: 20rpx;
|
||
}
|
||
|
||
.uni-padding-wrap {
|
||
width: 550rpx;
|
||
padding: 0 100rpx;
|
||
}
|
||
</style>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
// background-color: ;
|
||
}
|
||
|
||
.page {
|
||
width: 750rpx;
|
||
|
||
.bottom_park {
|
||
padding: 40rpx 42rpx;
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
z-index: 100;
|
||
width: 750rpx;
|
||
// height: 674rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 40rpx 40rpx 0 0;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
|
||
.gobtn {
|
||
margin-top: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
height: 80rpx;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
background: #64B6A7;
|
||
border-radius: 30rpx;
|
||
|
||
}
|
||
|
||
.tit {
|
||
width: 100%;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.tip {
|
||
margin-top: 12rpx;
|
||
width: 100%;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.parkimg {
|
||
margin-top: 40rpx;
|
||
width: 672rpx;
|
||
height: 388rpx;
|
||
}
|
||
|
||
.close {
|
||
position: absolute;
|
||
right: 34rpx;
|
||
top: 50rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
|
||
.fixdivce {
|
||
padding: 12rpx 22rpx 12rpx 22rpx;
|
||
position: fixed;
|
||
left: 0;
|
||
top: 25vh;
|
||
width: 334rpx;
|
||
height: 460rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 0 40rpx 40rpx 0;
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
|
||
.scrollable-content {
|
||
height: 100%;
|
||
overflow-y: auto;
|
||
|
||
.divce_li:last-child {
|
||
border-bottom: 1rpx solid #fff;
|
||
}
|
||
|
||
.divce_li {
|
||
padding: 10rpx 0;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
border-bottom: 1rpx solid #D8D8D8;
|
||
|
||
.left_img {
|
||
image {
|
||
width: 44rpx;
|
||
height: 70rpx;
|
||
}
|
||
}
|
||
|
||
.right_cont {
|
||
margin-left: 20rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #3D3D3D;
|
||
|
||
.right_top {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
|
||
.right_top_left {
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
|
||
image {
|
||
margin-right: 6rpx;
|
||
width: 12rpx;
|
||
height: 26rpx;
|
||
}
|
||
}
|
||
|
||
.right_top_right {
|
||
margin-left: auto;
|
||
}
|
||
}
|
||
|
||
.right_bot {
|
||
margin-top: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.maskload {
|
||
|
||
position: fixed;
|
||
padding: 46rpx;
|
||
bottom: 0;
|
||
width: 752rpx;
|
||
height: 780rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 40rpx 40rpx 0rpx 0rpx;
|
||
z-index: 101;
|
||
|
||
.maskpage0 {
|
||
.top_info {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
image {
|
||
margin-right: 16rpx;
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
}
|
||
|
||
.masktxt {
|
||
font-weight: 500;
|
||
font-size: 44rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.masktips {
|
||
margin-top: 20rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.tipsimg {
|
||
margin-top: 60rpx;
|
||
display: flex;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
|
||
image {
|
||
width: 554rpx;
|
||
height: 262rpx;
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
.maskpage1 {
|
||
.top_info {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
image {
|
||
margin-right: 16rpx;
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
}
|
||
|
||
.masktxt {
|
||
font-weight: 500;
|
||
font-size: 44rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.masktips {
|
||
margin-top: 20rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 32rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.tipsimg {
|
||
margin-top: 60rpx;
|
||
display: flex;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
|
||
image {
|
||
width: 554rpx;
|
||
height: 262rpx;
|
||
|
||
}
|
||
}
|
||
|
||
.btn_box {
|
||
width: 750rpx;
|
||
padding: 0 36rpx;
|
||
position: absolute;
|
||
bottom: 60rpx;
|
||
left: 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.btn3 {
|
||
// margin-right: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 300rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 45rpx 45rpx 45rpx 45rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.btn4 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 300rpx;
|
||
height: 90rpx;
|
||
border-radius: 45rpx 45rpx 45rpx 45rpx;
|
||
border: 2rpx solid #808080;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #808080;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.navBarBox {
|
||
position: fixed;
|
||
z-index: 10;
|
||
// background:#fff;
|
||
// background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 70%, transparent);
|
||
// background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.5) 75%, transparent 100%);
|
||
// background: linear-gradient( 180deg, #FFFFFF 58%, rgba(255,255,255,0) 52%);
|
||
|
||
.navBar {
|
||
width: 100vw;
|
||
// padding-top: 85rpx;
|
||
|
||
display: flex;
|
||
flex-direction: row;
|
||
// justify-content: center;
|
||
align-items: center;
|
||
// align-items: center;
|
||
// justify-content: center;
|
||
|
||
image {
|
||
margin-left: 20rpx;
|
||
// position: absolute;
|
||
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
z-index: 11;
|
||
}
|
||
|
||
.txts {
|
||
margin-left: -80rpx;
|
||
width: 100%;
|
||
// position: absolute;
|
||
z-index: 10;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||
}
|
||
|
||
}
|
||
|
||
// .order_tips {
|
||
// display: flex;
|
||
// flex-wrap: nowrap;
|
||
// align-items: center;
|
||
// margin-right: auto;
|
||
// // margin: 0 auto;
|
||
// margin-top: 38rpx;
|
||
// padding: 28rpx 41rpx;
|
||
// width: 688rpx;
|
||
// height: 110rpx;
|
||
// background: #3D3D3D;
|
||
// box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
// border-radius: 53rpx 53rpx 53rpx 53rpx;
|
||
|
||
// image {
|
||
// margin-right: 34rpx;
|
||
// width: 44rpx;
|
||
// height: 51rpx;
|
||
// }
|
||
|
||
// .order_tips_txt {
|
||
// font-weight: 400;
|
||
// font-size: 36rpx;
|
||
// color: #FFFFFF;
|
||
// }
|
||
|
||
// .icon-xiangyou1 {
|
||
// margin-left: auto;
|
||
// font-size: 36rpx;
|
||
// color: #FFFFFF;
|
||
// }
|
||
// }
|
||
.order_tips {
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
// margin-top: 20rpx;
|
||
margin-left: 34rpx;
|
||
padding: 28rpx 41rpx;
|
||
width: 688rpx;
|
||
height: 110rpx;
|
||
// background: #3D3D3D;
|
||
background: rgba(61, 61, 61, 0.8);
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 53rpx;
|
||
transition: width 0.5s, padding 0.5s;
|
||
|
||
&.collapsed {
|
||
width: 192rpx;
|
||
padding: 28rpx 20rpx;
|
||
}
|
||
|
||
image {
|
||
margin-right: 34rpx;
|
||
width: 44rpx;
|
||
height: 51rpx;
|
||
transition: margin-right 0.5s;
|
||
|
||
.order_tips.collapsed & {
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
|
||
.order_tips_txt {
|
||
font-weight: 400;
|
||
font-size: 36rpx;
|
||
color: #FFFFFF;
|
||
transition: opacity 0.5s, max-width 0.5s;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
|
||
&.collapsed {
|
||
opacity: 0;
|
||
max-width: 0;
|
||
}
|
||
}
|
||
|
||
.icon-xiangyou1 {
|
||
margin-left: auto;
|
||
font-size: 36rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.icon-xiangzuo {
|
||
margin-left: auto;
|
||
font-size: 38rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.swiper_tips {
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
padding: 18rpx 24rpx;
|
||
margin: 0 auto;
|
||
width: 688rpx;
|
||
height: 72rpx;
|
||
background: rgba(61, 61, 61, 0.8);
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 53rpx 53rpx 53rpx 53rpx;
|
||
|
||
.cont {
|
||
width: 90%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
|
||
image {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
margin-right: 32rpx;
|
||
}
|
||
|
||
.scroll-container {
|
||
overflow: hidden;
|
||
width: calc(100% - 68rpx);
|
||
/* Adjusting width to fit within container */
|
||
display: flex;
|
||
|
||
.scroll-text {
|
||
white-space: nowrap;
|
||
display: inline-block;
|
||
// animation: scroll-text 40s linear infinite;
|
||
}
|
||
}
|
||
}
|
||
|
||
.icon-xiangyou1 {
|
||
margin-left: auto;
|
||
color: #fff;
|
||
font-size: 30rpx;
|
||
}
|
||
}
|
||
|
||
@keyframes scroll-text {
|
||
0% {
|
||
transform: translateX(0);
|
||
}
|
||
|
||
100% {
|
||
transform: translateX(-100%);
|
||
}
|
||
}
|
||
}
|
||
|
||
.my-location {
|
||
|
||
position: fixed;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
right: 30rpx;
|
||
top: 400rpx;
|
||
// background-color: #fff;
|
||
border-radius: 50%;
|
||
width: 82rpx;
|
||
height: 82rpx;
|
||
z-index: 10;
|
||
|
||
.img {
|
||
width: 82rpx;
|
||
height: 82rpx;
|
||
}
|
||
}
|
||
|
||
.park {
|
||
position: fixed;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
right: 30rpx;
|
||
top: 480rpx;
|
||
// background-color: #fff;
|
||
border-radius: 50%;
|
||
width: 82rpx;
|
||
height: 82rpx;
|
||
z-index: 10;
|
||
|
||
.img {
|
||
width: 82rpx;
|
||
height: 82rpx;
|
||
}
|
||
}
|
||
|
||
.feeDetail {
|
||
padding: 36rpx 22rpx;
|
||
position: fixed;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 750rpx;
|
||
height: 900rpx;
|
||
background: #F7F7F7;
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 53rpx 53rpx 0 0;
|
||
z-index: 200;
|
||
overflow-y: auto;
|
||
|
||
/* Enable vertical scrolling */
|
||
.close {
|
||
position: absolute;
|
||
top: 20rpx;
|
||
right: 40rpx;
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
}
|
||
|
||
.feeCard {
|
||
margin-top: 20rpx;
|
||
padding: 38rpx;
|
||
width: 708rpx;
|
||
// height: 710rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 32rpx 32rpx 32rpx 32rpx;
|
||
|
||
.tit1 {
|
||
font-weight: 500;
|
||
font-size: 32rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.cont {
|
||
width: 100%;
|
||
margin-top: 26rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
|
||
.left {
|
||
width: 40%;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.right {
|
||
width: 60%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #FF4444;
|
||
|
||
.li {
|
||
width: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.tipss_box {
|
||
width: 370rpx;
|
||
height: 73rpx;
|
||
position: fixed;
|
||
bottom: 35.5vh;
|
||
left: 38rpx;
|
||
|
||
.tipss {
|
||
// position: fixed;
|
||
margin-top: 15rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-wrap: nowrap;
|
||
|
||
image {
|
||
margin-right: 15rpx;
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
|
||
width: 350rpx;
|
||
height: 64rpx;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 53rpx 53rpx 53rpx 53rpx;
|
||
}
|
||
|
||
.swiper {
|
||
height: 80rpx;
|
||
|
||
.tipss {
|
||
// position: fixed;
|
||
margin-top: 15rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-wrap: nowrap;
|
||
|
||
image {
|
||
margin-right: 15rpx;
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
|
||
width: 350rpx;
|
||
height: 64rpx;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 53rpx 53rpx 53rpx 53rpx;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
|
||
.map {
|
||
width: 750rpx;
|
||
height: 76vh;
|
||
}
|
||
|
||
.botmbox2 {
|
||
|
||
position: fixed;
|
||
bottom: 0;
|
||
padding: 30rpx 20rpx 40rpx;
|
||
width: 750rpx;
|
||
// height: 272rpx;
|
||
background: #F7F7F7;
|
||
border-radius: 50rpx 50rpx 0 0;
|
||
z-index: 100;
|
||
|
||
.close {
|
||
position: absolute;
|
||
top: 20rpx;
|
||
right: 40rpx;
|
||
width: 35rpx;
|
||
height: 35rpx;
|
||
}
|
||
|
||
.page1 {
|
||
.top {
|
||
// margin-top: 20rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
|
||
padding-bottom: 28rpx;
|
||
border-bottom: 2rpx solid #D8D8D8;
|
||
|
||
.left {
|
||
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
|
||
image {
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
}
|
||
}
|
||
|
||
.top_center {
|
||
width: 50%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
margin-left: 28rpx;
|
||
|
||
.cent_top {
|
||
|
||
width: 100%;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.cent_bot {
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #ccc;
|
||
}
|
||
}
|
||
|
||
.top_right {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-left: auto;
|
||
margin-right: 35rpx;
|
||
width: 160rpx;
|
||
height: 60rpx;
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
border: 2rpx solid #64B6A8;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #64B6A8;
|
||
}
|
||
}
|
||
|
||
.center {
|
||
margin-top: 42rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
// justify-content: space-around;
|
||
padding-bottom: 28rpx;
|
||
border-bottom: 2rpx solid #D8D8D8;
|
||
|
||
.center_left {
|
||
width: 50%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
|
||
.center_left_top {
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.center_left_bot {
|
||
margin-top: 32rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 60rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.center_right {
|
||
width: 50%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
|
||
.center_right_top {
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.center_right_bot {
|
||
margin-top: 32rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 60rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
}
|
||
|
||
.bot {
|
||
margin-top: 42rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
justify-content: space-between;
|
||
|
||
.left_btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-bottom: 2rpx;
|
||
width: 338rpx;
|
||
height: 90rpx;
|
||
border-radius: 45rpx 45rpx 45rpx 45rpx;
|
||
border: 2rpx solid #808080;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.right_btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-bottom: 2rpx;
|
||
width: 338rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 45rpx 45rpx 45rpx 45rpx;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.tips {
|
||
margin-top: 42rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.page2 {
|
||
.top {
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
width: 100%;
|
||
// height: 284rpx;
|
||
padding-bottom: 30rpx;
|
||
|
||
.left {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
width: 50%;
|
||
padding-top: 10rpx;
|
||
|
||
.text {
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.ele {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
|
||
font-weight: 400;
|
||
font-size: 40rpx;
|
||
color: #64B6A8;
|
||
|
||
image {
|
||
margin-right: 18rpx;
|
||
width: 22rpx;
|
||
height: 48rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
width: 50%;
|
||
padding-top: 10rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
|
||
|
||
.text {
|
||
text-align: center;
|
||
width: 100%;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.speed {
|
||
margin-top: 18rpx;
|
||
width: 226rpx;
|
||
height: 22rpx;
|
||
background: #ccc;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
|
||
.speeds {
|
||
// width: 90%;
|
||
height: 100%;
|
||
background: #64B6A7;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
}
|
||
}
|
||
|
||
.txt {
|
||
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
// align-items: center;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
font-weight: 500;
|
||
font-size: 72rpx;
|
||
color: #3D3D3D;
|
||
|
||
span {
|
||
font-weight: 700;
|
||
margin-top: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.center::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
|
||
.center {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
overflow-x: auto; // 添加水平滚动条
|
||
margin-bottom: 200rpx;
|
||
white-space: nowrap; // 确保子元素不换行
|
||
padding: 20rpx 0;
|
||
background: #F7F7F7;
|
||
|
||
.card {
|
||
|
||
// max-width: 600rpx !important; // 确保宽度被应用
|
||
width: 450rpx !important;
|
||
height: 288rpx;
|
||
margin-right: 20rpx;
|
||
position: relative;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 16rpx;
|
||
border: 2rpx solid #fff;
|
||
|
||
image {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
width: 82rpx;
|
||
height: 50rpx;
|
||
}
|
||
|
||
.tips_btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
bottom: 0;
|
||
// width: 350rpx;
|
||
width: 100%;
|
||
height: 70rpx;
|
||
background: #64B6A8;
|
||
border-radius: 0rpx 0rpx 16rpx 16rpx;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.tit {
|
||
padding: 18rpx 0 0 18rpx;
|
||
/* Adds padding to the top and left sides */
|
||
width: 300rpx;
|
||
/* Sets a fixed width for the element */
|
||
display: flex;
|
||
/* Uses flexbox for layout */
|
||
align-items: center;
|
||
/* Vertically centers the content */
|
||
font-weight: 500;
|
||
/* Sets the font weight to medium */
|
||
font-size: 36rpx;
|
||
/* Sets the font size */
|
||
color: #3D3D3D;
|
||
/* Sets the text color */
|
||
white-space: nowrap;
|
||
/* Prevents the text from wrapping to the next line */
|
||
overflow: hidden;
|
||
/* Hides any content that overflows the element's box */
|
||
text-overflow: ellipsis;
|
||
/* 显示省略号 */
|
||
}
|
||
|
||
.nmtxt {
|
||
|
||
width: 100%;
|
||
margin-top: 22rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.left {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.right {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.red {
|
||
font-weight: 400;
|
||
font-size: 36rpx;
|
||
color: #FF4444;
|
||
}
|
||
}
|
||
|
||
.tip {
|
||
margin-top: 14rpx;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #808080;
|
||
}
|
||
|
||
.tips {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: auto;
|
||
font-size: 30rpx;
|
||
color: #3D3D3D;
|
||
|
||
.icon-chakanxiangqing {
|
||
font-size: 30rpx;
|
||
color: #3D3D3D;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
}
|
||
|
||
.act1 {
|
||
border: 2rpx solid #64B6A8;
|
||
}
|
||
}
|
||
|
||
|
||
.bot {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 750rpx;
|
||
height: 210rpx;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08), 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
|
||
.xy {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.yuans {
|
||
margin-top: 2rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 27rpx;
|
||
height: 27rpx;
|
||
border-radius: 50%;
|
||
border: #808080 solid 2rpx;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 50%;
|
||
}
|
||
}
|
||
|
||
.txt {
|
||
margin-left: 10rpx;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #979797;
|
||
|
||
span {
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.btn {
|
||
margin-top: 10rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 680rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
}
|
||
|
||
.page3 {
|
||
|
||
|
||
.bot_btns {
|
||
// position: relative;
|
||
// display: flex;
|
||
// justify-content: center;
|
||
width: 750rpx;
|
||
height: 640rpx;
|
||
// background: #fff;
|
||
// box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 50rpx 50rpx 0 0;
|
||
// padding-left: 8rpx;
|
||
padding-left: 10rpx;
|
||
|
||
.infoss {
|
||
|
||
// margin-top: 20rpx;
|
||
|
||
padding: 0 55rpx;
|
||
// margin-right: 20rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
width: 695rpx;
|
||
height: 100rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
// margin: 0 auto;
|
||
}
|
||
|
||
|
||
|
||
.cardss {
|
||
position: absolute;
|
||
bottom: 240rpx;
|
||
// margin-top: 20rpx;
|
||
padding: 20rpx 30rpx;
|
||
width: 695rpx;
|
||
// height: 288rpx;
|
||
background: #fff;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
|
||
.tit {
|
||
font-weight: 500;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.changebiketip {
|
||
bottom: 20rpx;
|
||
left: 280rpx;
|
||
position: absolute;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.cont {
|
||
margin-top: 30rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.left {
|
||
.text {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.speed {
|
||
margin-top: 18rpx;
|
||
width: 226rpx;
|
||
height: 22rpx;
|
||
background: red;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
|
||
.speeds {
|
||
// width: 90%;
|
||
height: 100%;
|
||
background: #64B6A7;
|
||
border-radius: 16rpx 0rpx 0rpx 16rpx;
|
||
}
|
||
}
|
||
|
||
.mac {
|
||
margin-top: 18rpx;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
image {
|
||
width: 244rpx;
|
||
height: 196rpx;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.bot {
|
||
display: flex;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 750rpx;
|
||
height: 220rpx;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08), 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
padding-top: 30rpx;
|
||
|
||
.changebiketip {
|
||
bottom: 40rpx;
|
||
left: 320rpx;
|
||
position: absolute;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.btn {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 338rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.btn1 {
|
||
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
width: 338rpx;
|
||
height: 90rpx;
|
||
border-radius: 45rpx 45rpx 45rpx 45rpx;
|
||
border: 2rpx solid #808080;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #808080;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.page4 {
|
||
.bot_btn {
|
||
padding-top: 20rpx;
|
||
// margin-top: 20rpx;
|
||
// padding: 26rpx 34rpx 48rpx 34rpx;
|
||
// position: fixed;
|
||
// display: flex;
|
||
// flex-wrap: wrap;
|
||
// justify-content: center;
|
||
// bottom: 0;
|
||
// width: 750rpx;
|
||
height: 400rpx;
|
||
background: #FFFFFF;
|
||
// box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 30rpx;
|
||
|
||
.time {
|
||
// height: 88rpx;
|
||
|
||
width: 100%;
|
||
text-align: center;
|
||
padding-bottom: 24rpx;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
border-bottom: 2rpx solid #EFEFEF;
|
||
}
|
||
|
||
.price {
|
||
margin-top: 22rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 72rpx;
|
||
color: #3D3D3D;
|
||
|
||
span {
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
|
||
.toinfo {
|
||
// margin-top: 12rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.btn {
|
||
margin-top: 34rpx;
|
||
margin-left: 40rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 600rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
.botmbox {
|
||
position: fixed;
|
||
bottom: 0;
|
||
padding: 40rpx 32rpx;
|
||
width: 750rpx;
|
||
// height: 272rpx;
|
||
background: #fff;
|
||
border-radius: 50rpx 50rpx 0 0;
|
||
|
||
.guangggao {
|
||
margin-top: 34rpx;
|
||
|
||
image {
|
||
width: 686rpx;
|
||
height: 160rpx;
|
||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||
}
|
||
}
|
||
|
||
.top_btn {
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 686rpx;
|
||
height: 90rpx;
|
||
// background: #64B6A8;
|
||
background: #64B6A8;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
|
||
image {
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
}
|
||
|
||
.bot_btn {
|
||
margin-top: 34rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.cont {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
width: 112rpx;
|
||
|
||
image {
|
||
width: 44rpx;
|
||
height: 44rpx;
|
||
}
|
||
|
||
.text {
|
||
margin-top: 12rpx;
|
||
width: 112rpx;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.pops {
|
||
padding: 46rpx 36rpx;
|
||
position: fixed;
|
||
top: 400rpx;
|
||
left: 74rpx;
|
||
width: 604rpx;
|
||
// height: 606rpx;
|
||
background: #fff;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
z-index: 110;
|
||
|
||
.close {
|
||
position: absolute;
|
||
left: 266rpx;
|
||
bottom: -100rpx;
|
||
|
||
image {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
}
|
||
|
||
.loading_box {
|
||
width: 100%;
|
||
// height: 200rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
image {
|
||
width: 336rpx;
|
||
height: 154rpx;
|
||
}
|
||
|
||
// .loader {
|
||
// width: 120rpx;
|
||
// aspect-ratio: 1;
|
||
// border-radius: 50%;
|
||
// clip-path: inset(-360rpx); /* 4倍的比例调整 */
|
||
// box-shadow: -240rpx 60rpx, -240rpx 60rpx, -240rpx 60rpx; /* 4倍的比例调整 */
|
||
// transform: translateY(-60rpx); /* 4倍的比例调整 */
|
||
// animation: l19 1s infinite linear;
|
||
// }
|
||
|
||
// @keyframes l19 {
|
||
// 16.67% {box-shadow:-240rpx 60rpx,-240rpx 60rpx, 76rpx 60rpx} /* 4倍的比例调整 */
|
||
// 33.33% {box-shadow:-240rpx 60rpx, 0px 60rpx, 76rpx 60rpx} /* 4倍的比例调整 */
|
||
// 40%,60%{box-shadow: -76rpx 60rpx, 0px 60rpx, 76rpx 60rpx} /* 4倍的比例调整 */
|
||
// 66.67% {box-shadow: -76rpx 60rpx, 0px 60rpx, 240rpx 60rpx} /* 4倍的比例调整 */
|
||
// 83.33% {box-shadow: -76rpx 60rpx, 240rpx 60rpx,240rpx 60rpx} /* 4倍的比例调整 */
|
||
// 100% {box-shadow: 240rpx 60rpx, 240rpx 60rpx,240rpx 60rpx} /* 4倍的比例调整 */
|
||
// }
|
||
|
||
}
|
||
|
||
.btn_box {
|
||
margin-top: 80rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.btn1 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 216rpx;
|
||
height: 90rpx;
|
||
background: #989898;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.btn2 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 268rpx;
|
||
height: 90rpx;
|
||
background: #64B6A8;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
|
||
.time {
|
||
margin-top: 20rpx;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 48rpx;
|
||
color: #64B6A8;
|
||
}
|
||
|
||
.cont {
|
||
height: 500rpx;
|
||
overflow-x: hidden;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.tit {
|
||
// width: 604rpx;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
margin-bottom: 54rpx;
|
||
}
|
||
|
||
.cont_box {
|
||
margin-top: 36rpx;
|
||
display: flex;
|
||
flex-wrap: nowrap;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.left {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
|
||
.km {
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.speed {
|
||
margin-top: 18rpx;
|
||
width: 226rpx;
|
||
height: 22rpx;
|
||
background: #ccc;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
|
||
.speeds {
|
||
// width: 90%;
|
||
height: 100%;
|
||
background: #64B6A7;
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
}
|
||
}
|
||
|
||
.NO {
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #3D3D3D;
|
||
|
||
image {
|
||
width: 244rpx;
|
||
height: 196rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.text {
|
||
margin-top: 36rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
// align-items: center;
|
||
|
||
.yuan {
|
||
margin-top: 10rpx;
|
||
margin-right: 12rpx;
|
||
width: 20rpx;
|
||
height: 20rpx;
|
||
background: #000;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
span {
|
||
width: 90%;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
margin-left: 40rpx;
|
||
margin-top: 50rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 470rpx;
|
||
height: 90rpx;
|
||
background: #1E807A;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.act1 {
|
||
background-color: #ccc;
|
||
}
|
||
}
|
||
|
||
|
||
.bottom_more {
|
||
position: fixed;
|
||
|
||
bottom: 0;
|
||
width: 750rpx;
|
||
height: 530rpx;
|
||
background: linear-gradient(180deg, #EEF5FD 20%, rgba(255, 255, 255, 0)30%), #FFFFFF;
|
||
border-radius: 30rpx;
|
||
padding: 48rpx 36rpx;
|
||
z-index: 30;
|
||
|
||
.close {
|
||
position: absolute;
|
||
right: 32rpx;
|
||
top: 32rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
|
||
image {
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
|
||
.tit {
|
||
font-weight: 500;
|
||
font-size: 44rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
|
||
.contbox {
|
||
margin-top: 44rpx;
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.cont_li {
|
||
margin-top: 22rpx;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
// align-items: center;
|
||
justify-content: center;
|
||
width: 158rpx;
|
||
height: 124rpx;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0, 0, 0, 0.08);
|
||
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
||
margin-right: 10rpx;
|
||
|
||
image {
|
||
margin-top: 18rpx;
|
||
width: 46rpx;
|
||
height: 46rpx;
|
||
}
|
||
|
||
.txt {
|
||
width: 100%;
|
||
margin-top: 10rpx;
|
||
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #3D3D3D;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |