2024-09-19 17:33:39 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<view class="page">
|
|
|
|
|
|
<view class="fixed">
|
|
|
|
|
|
<u-navbar title="确认订单 " :border-bottom="false" :background="background" title-color='#000' title-size='36'
|
|
|
|
|
|
height='45' back-icon-color='#000'></u-navbar>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="backimg">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- <image class="backimg" src="https://lxnapi.ccttiot.com/bike/img/static/usCZzuQpGCBUpvzCfqyE" mode=""></image> -->
|
|
|
|
|
|
<view class="car_info">
|
|
|
|
|
|
<view class="left">
|
|
|
|
|
|
<view class="name">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{modelInfo.model}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="car_type_li">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="type" v-for="(items,indexs) in modelInfo.accessorys" :key="indexs">
|
2024-10-14 18:02:05 +08:00
|
|
|
|
{{items.name}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<image :src="modelInfo.picture" mode=""></image>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="delivery_cont">
|
|
|
|
|
|
<view class="delivery_top">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="delivery_left" :class="typeidx==0? '':'leftact'" @click="changeType(0)">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="cont">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
商家 <span>{{ agentInfo.isFreeCar ? '免费' : '收费' }}</span> 上门
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/uH4UHjLW8QlIRyrroLpi" mode=""
|
|
|
|
|
|
v-if="typeidx==0"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="delivery_right" :class="typeidx==1? 'rightact':''" @click="changeType(1)">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="cont">
|
|
|
|
|
|
自行前往门店
|
|
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/uH4UHjLW8QlIRyrroLpi" mode=""
|
|
|
|
|
|
v-if="typeidx==1"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="delivery_info">
|
|
|
|
|
|
<view class="type1" v-if="typeidx==0">
|
|
|
|
|
|
<view class="lins" :style="{ height: height + 'px' }">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="getcar">
|
|
|
|
|
|
<view class="li" id="startType">
|
|
|
|
|
|
<view class="type">
|
|
|
|
|
|
取车
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="txt"
|
|
|
|
|
|
style="width: 100%;display: flex;flex-wrap: nowrap;justify-content: space-between;">
|
|
|
|
|
|
{{time}}
|
|
|
|
|
|
<view
|
|
|
|
|
|
style="color:#808080 ;margin-left: 80rpx;font-size: 28rpx;display: flex;align-items: center;"
|
|
|
|
|
|
@click="time1=true">更改时间 <image
|
|
|
|
|
|
src="https://lxnapi.ccttiot.com/bike/img/static/uqQXXl6pKLlJDYAFrxFI" mode=""
|
|
|
|
|
|
style="width: 26rpx;height: 26rpx;"></image>
|
|
|
|
|
|
</view>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="li">
|
|
|
|
|
|
<view style="width: 68rpx;">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="txt" style="font-size: 28rpx;" v-if="agentInfo.isFreeCar==false">
|
2024-10-14 18:02:05 +08:00
|
|
|
|
商家收费送车上门（服务费{{agentInfo.deliveryFee}}元）
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="txt" style="font-size: 28rpx;" v-if="agentInfo.isFreeCar">
|
|
|
|
|
|
商家免费送车上门
|
|
|
|
|
|
</view>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="li">
|
|
|
|
|
|
<view class="types">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{timenum}}{{timetype(chosePriceInfo.rentalUnit)}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tips">
|
|
|
|
|
|
取车后开始计算订单时长
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="li" style="margin-top: 28rpx;" id="endType">
|
|
|
|
|
|
<view class="backtype">
|
|
|
|
|
|
还车
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{backTime()}}
|
|
|
|
|
|
<!-- 2024年09月04日 今天16:00 -->
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="li" @click="handleClick">
|
|
|
|
|
|
<view
|
|
|
|
|
|
style="width: 68rpx;color: #3D3D3D;font-size: 28rpx;font-weight: 600;margin-left: 8rpx;">
|
|
|
|
|
|
地址
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<input type="text" v-model="address" placeholder="请输入您的详细地址或点击右侧进行定位" class="input"
|
|
|
|
|
|
placeholder-style="color:#C7CDD3" @click="handleInputClick" />
|
|
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/ubBrE0P90fPYvhvbdzHy" mode="">
|
|
|
|
|
|
</image>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="type1" v-if="typeidx==1">
|
|
|
|
|
|
<view class="lins" :style="{ height: height + 'px' }">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="maps">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/uwTvqfidPmUFMxB5ViZa" mode=""
|
|
|
|
|
|
@click="mapFun()"></image>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="getcar">
|
|
|
|
|
|
<view class="li" id="startType1">
|
|
|
|
|
|
<view class="type">
|
|
|
|
|
|
取车
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="txt"
|
|
|
|
|
|
style="width: 100%;display: flex;flex-wrap: nowrap;justify-content: space-between;">
|
|
|
|
|
|
2024年09月04日 16:00 <view
|
|
|
|
|
|
style="color:#808080 ;margin-left: 80rpx;font-size: 28rpx;display: flex;align-items: center;"
|
|
|
|
|
|
@click="time1=true">
|
|
|
|
|
|
更改时间 <image src="https://lxnapi.ccttiot.com/bike/img/static/uqQXXl6pKLlJDYAFrxFI"
|
|
|
|
|
|
mode="" style="width: 26rpx;height: 26rpx;"></image>
|
|
|
|
|
|
</view>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="li">
|
|
|
|
|
|
<view style="width: 68rpx;">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt" style="font-size: 28rpx;width: 90%;">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
自行前往门店取车 {{storeInfo.simpleAddress}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="li">
|
|
|
|
|
|
<view style="width: 68rpx;">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt" style="font-size: 28rpx;width: 90%;">
|
|
|
|
|
|
直线距离 {{km}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="li">
|
|
|
|
|
|
<view class="types">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{timenum}}{{timetype(chosePriceInfo.rentalUnit)}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tips">
|
|
|
|
|
|
取车后开始计算订单时长
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="li" style="margin-top: 28rpx;" id="endType1">
|
|
|
|
|
|
<view class="backtype">
|
|
|
|
|
|
还车
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{backTime()}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<!-- <view class="li">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view style="width: 68rpx;">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt" style="font-size: 28rpx;width: 90%;">
|
|
|
|
|
|
自行前往门店还车 福建省宁德市福鼎市太...
|
|
|
|
|
|
门店距【福鼎太姥山...】直线距离3.8km
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
</view> -->
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="time_card">
|
|
|
|
|
|
<view class="tit">
|
|
|
|
|
|
选择租车方案
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="choose_box">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="choose_li" v-for="(item,index) in priceList" :key="index"
|
|
|
|
|
|
:class="index ==priceIndex? 'act1':''" @click="changePrice(item,index)">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="time">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
1{{timetype(item.rentalUnit)}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="price">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
￥ <span>{{item.price}}</span>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<!-- <view class="hot">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
21:00前还车
|
2024-09-30 18:02:38 +08:00
|
|
|
|
</view> -->
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="num_box">
|
|
|
|
|
|
<view class="lefttxt">
|
|
|
|
|
|
租车时长
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right">
|
|
|
|
|
|
<view class="txt">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
共{{timenum}}{{timetype(chosePriceInfo.rentalUnit)}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="choosnum">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="left" @click="subtractnum()">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/uTAyQiL5vJLelU4MBb1D" mode="">
|
|
|
|
|
|
</image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="cont">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{timenum}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="right" @click="addnum()">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/usXAYHilspF1jJeMdPIE" mode="">
|
|
|
|
|
|
</image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
2024-10-14 18:02:05 +08:00
|
|
|
|
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="yj_box">
|
|
|
|
|
|
<view class="top_txt">
|
|
|
|
|
|
<view class="txts">
|
|
|
|
|
|
押金
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tips_btn">
|
|
|
|
|
|
押金政策 <view class="iconfont icon-xiangyou1"></view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="yj_line">
|
|
|
|
|
|
<view class="yuan">
|
|
|
|
|
|
取车前
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="line"></view>
|
|
|
|
|
|
<view class="yuan">
|
|
|
|
|
|
取车后
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt_box">
|
|
|
|
|
|
<view class="txt">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
押金￥{{modelInfo.deposit}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt">
|
|
|
|
|
|
全部退还
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tip_box">
|
|
|
|
|
|
<view class="tops">
|
|
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/u43YAsOyDu65EK2KOFN8" mode=""></image>
|
|
|
|
|
|
线上交押
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="words">
|
|
|
|
|
|
押金由平台保管，安心有保障
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tipstxt">
|
|
|
|
|
|
为保障您的权益，请勿与门店私下交易
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-10-14 18:02:05 +08:00
|
|
|
|
<view class="insurance_box" v-if="false">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="backcolor"></view>
|
|
|
|
|
|
<view class="tit_box">
|
|
|
|
|
|
增值服务
|
|
|
|
|
|
<view class="txt">
|
|
|
|
|
|
出行有保障，家人更放心
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="info">
|
|
|
|
|
|
<view class="left">
|
|
|
|
|
|
骑行享权服务
|
|
|
|
|
|
<view class="txt1">
|
|
|
|
|
|
享权须知
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right_txt">
|
|
|
|
|
|
￥10.8/天
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="choose_insurance_box">
|
|
|
|
|
|
<view class="insurance_li" v-for="item in 5" :key="index">
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble_box">
|
|
|
|
|
|
<view class="tit">
|
|
|
|
|
|
租车预定须知
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tit" style="margin-top: 16rpx;">
|
|
|
|
|
|
取车须知
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt2">
|
|
|
|
|
|
请在2024-09-04 16:00:36时间前取车，超出时间将 无法保证车辆库存
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble">
|
|
|
|
|
|
<view class="tabble_top">
|
|
|
|
|
|
<view class="tabbl_left">
|
|
|
|
|
|
取消时间
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble_right">
|
|
|
|
|
|
扣费标准
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="tabble_cont" v-for="(item,index) in agentInfo.cancelRuleList" :key="index">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="tabbl_left">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{item.instructions}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble_right">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
{{backDedu(item.deductPercent)}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tit" style="margin-top: 16rpx;">
|
|
|
|
|
|
配套服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="tabble">
|
|
|
|
|
|
<view class="tabble_top">
|
|
|
|
|
|
<view class="tabbl_left">
|
|
|
|
|
|
电池
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble_right">
|
|
|
|
|
|
其他
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="tabble_cont">
|
|
|
|
|
|
<view class="tabbl_left">
|
|
|
|
|
|
超过取车时间2小时内
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tabble_right">
|
|
|
|
|
|
扣费标准
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<u-mask :show="showtips" :z-index='100' />
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="tips_box" v-if="showtips">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="tit">
|
|
|
|
|
|
线上交押
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt">
|
|
|
|
|
|
取车前需支付押金，在商家确认还车及无
|
|
|
|
|
|
车损，还车后立即退还全部押金。
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="btn">
|
|
|
|
|
|
我知道了
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="sub_box">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="detail" v-if="showmx">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
|
|
|
|
|
<view class="tit">
|
|
|
|
|
|
订单明细
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="close" @click="showmx=false">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/uYLkBxKrJq35FjyHy2Jr" mode=""></image>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="txt_li">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
<view class="txt5">
|
|
|
|
|
|
租金
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt5">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
￥{{priceInfo.rent}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt_li">
|
|
|
|
|
|
<view class="txt5">
|
|
|
|
|
|
押金
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt5">
|
|
|
|
|
|
￥{{priceInfo.deposit}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt_li">
|
|
|
|
|
|
<view class="txt5">
|
|
|
|
|
|
派送费
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt5">
|
|
|
|
|
|
￥{{priceInfo.deliveryFee}}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="bot_box">
|
|
|
|
|
|
<view class="xiey">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="yuan" v-if="agree==false" @click="agree=true"></view>
|
|
|
|
|
|
<image src="https://lxnapi.ccttiot.com/bike/img/static/utRg4QWBaHX4RO3tgZQW" mode="" v-if="agree" @click="agree=false"></image>
|
|
|
|
|
|
<view class="txt3" style="margin-left: 6rpx;">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
已阅读并同意
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="txt4">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<span @click="toWord(0)">《电动车租赁用户协议》</span> <span @click="toWord(1)">《享权须知》</span>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="price_box">
|
|
|
|
|
|
<view class="price">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
￥<span>{{ priceInfo.totalFee? priceInfo.totalFee : '--' }}</span>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="mx" @click="showmx=true">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
明细 <view class="iconfont icon-xiangxia">
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<!-- <view class="iconfont icon-xiangshang"> -->
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<view class="btn" @click="sub">
|
2024-09-19 17:33:39 +08:00
|
|
|
|
去支付
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-10-14 18:02:05 +08:00
|
|
|
|
|
|
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
<u-picker mode="time" v-model="time1" :params="params" @confirm="confirm1" start-year="2024"
|
|
|
|
|
|
:default-time="pickertime" start="2024"></u-picker>
|
2024-09-19 17:33:39 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
typeidx: 0,
|
2024-09-19 17:33:39 +08:00
|
|
|
|
height: 0,
|
2024-09-30 18:02:38 +08:00
|
|
|
|
showtips: false,
|
|
|
|
|
|
modelId: '',
|
|
|
|
|
|
storeId: '',
|
|
|
|
|
|
modelInfo: {},
|
|
|
|
|
|
storeInfo: {},
|
|
|
|
|
|
agentInfo: {},
|
|
|
|
|
|
priceList: [],
|
|
|
|
|
|
deliveryMethod: 1,
|
|
|
|
|
|
time1: false,
|
|
|
|
|
|
params: {
|
|
|
|
|
|
year: false,
|
|
|
|
|
|
month: true,
|
|
|
|
|
|
day: true,
|
|
|
|
|
|
hour: true,
|
|
|
|
|
|
minute: true,
|
|
|
|
|
|
second: false
|
|
|
|
|
|
},
|
|
|
|
|
|
time: "",
|
|
|
|
|
|
gps: {},
|
|
|
|
|
|
km: '',
|
|
|
|
|
|
startDate: '',
|
|
|
|
|
|
pickertime: '',
|
|
|
|
|
|
priceIndex: 0,
|
|
|
|
|
|
chosePriceInfo: {},
|
|
|
|
|
|
timenum: 1,
|
|
|
|
|
|
priceInfo: {},
|
|
|
|
|
|
showmx: false,
|
|
|
|
|
|
address: '',
|
|
|
|
|
|
addlon: null,
|
|
|
|
|
|
addlat: null,
|
|
|
|
|
|
agree:false
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
}
|
|
|
|
|
|
},
|
2024-09-30 18:02:38 +08:00
|
|
|
|
onLoad(e) {
|
|
|
|
|
|
if (e) {
|
|
|
|
|
|
this.modelId = e.modelId
|
|
|
|
|
|
this.storeId = e.storeId
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
console.log(e, 'eee');
|
|
|
|
|
|
},
|
2024-09-19 17:33:39 +08:00
|
|
|
|
onShow() {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// this.getToken()
|
|
|
|
|
|
let that = this
|
|
|
|
|
|
uni.getLocation({
|
|
|
|
|
|
type: 'gcj02',
|
|
|
|
|
|
success: function(lb) {
|
|
|
|
|
|
|
|
|
|
|
|
that.gps.latitude = lb.latitude;
|
|
|
|
|
|
that.gps.longitude = lb.longitude;
|
|
|
|
|
|
that.getKm()
|
|
|
|
|
|
},
|
|
|
|
|
|
fail: function(error) {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: '未获取到定位信息，请点击设置勾选允许位置信息，即可使用全部功能',
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
// that.getmarks()
|
|
|
|
|
|
// 在这里处理获取位置信息失败的情况
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
})
|
2024-09-19 17:33:39 +08:00
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
|
const query = uni.createSelectorQuery().in(this);
|
|
|
|
|
|
query.select('.getcar').boundingClientRect(data => {
|
|
|
|
|
|
|
|
|
|
|
|
this.height = data.height + 45
|
|
|
|
|
|
console.log('ips_box height:', this.height);
|
|
|
|
|
|
}).exec();
|
|
|
|
|
|
}, 300);
|
2024-09-30 18:02:38 +08:00
|
|
|
|
this.calculateDistance(0);
|
|
|
|
|
|
this.getmodelInfo()
|
|
|
|
|
|
this.getstoreInfo()
|
|
|
|
|
|
|
|
|
|
|
|
const now = new Date();
|
|
|
|
|
|
const year = now.getFullYear();
|
|
|
|
|
|
const month = now.getMonth() + 1; // 月份从0开始，因此加1
|
|
|
|
|
|
const day = now.getDate();
|
|
|
|
|
|
|
|
|
|
|
|
// 设置一个小时后的时间
|
|
|
|
|
|
let hour = now.getHours() + 1;
|
|
|
|
|
|
let nextDay = day;
|
|
|
|
|
|
let nextMonth = month;
|
|
|
|
|
|
|
|
|
|
|
|
// 如果 hour 超过 23，调整日期
|
|
|
|
|
|
if (hour >= 24) {
|
|
|
|
|
|
hour = 0;
|
|
|
|
|
|
nextDay += 1;
|
|
|
|
|
|
|
|
|
|
|
|
// 获取当前月份的天数
|
|
|
|
|
|
const daysInMonth = new Date(year, month, 0).getDate();
|
|
|
|
|
|
if (nextDay > daysInMonth) {
|
|
|
|
|
|
nextDay = 1;
|
|
|
|
|
|
nextMonth += 1;
|
|
|
|
|
|
|
|
|
|
|
|
// 如果超过12月，调整到下一年
|
|
|
|
|
|
if (nextMonth > 12) {
|
|
|
|
|
|
nextMonth = 1;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
const minute = 0;
|
|
|
|
|
|
// 格式化为 MM-DD 的字符串
|
|
|
|
|
|
this.startDate =
|
|
|
|
|
|
`${nextMonth < 10 ? '0' : ''}${nextMonth}-${nextDay < 10 ? '0' : ''}${nextDay} ${hour < 10 ? '0' : ''}${hour}:${minute < 10 ? '0' : ''}${minute}`;
|
|
|
|
|
|
// 设置时间为当前年份、月份、日期、一个小时后的时间，分钟为 00，格式为 YYYY年MM月DD日 HH:mm
|
|
|
|
|
|
this.time =
|
|
|
|
|
|
`${year}年${nextMonth < 10 ? '0' : ''}${nextMonth}月${nextDay < 10 ? '0' : ''}${nextDay}日 ${hour < 10 ? '0' : ''}${hour}:${minute < 10 ? '0' : ''}${minute}`;
|
|
|
|
|
|
// 初始化 pickertime 为当天的默认日期
|
|
|
|
|
|
this.pickertime = this.startDate;
|
|
|
|
|
|
|
|
|
|
|
|
console.log('startDate:', this.startDate);
|
|
|
|
|
|
console.log('time:', this.time);
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
},
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
methods: {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
handleClick() {
|
|
|
|
|
|
if (!this.address) {
|
|
|
|
|
|
this.getMapLocation();
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
handleInputClick(event) {
|
|
|
|
|
|
if (!this.address) {
|
|
|
|
|
|
// 阻止输入框默认行为，避免在 address 为空时进行输入
|
|
|
|
|
|
event.stopPropagation();
|
|
|
|
|
|
this.getMapLocation();
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
sub() {
|
|
|
|
|
|
if(this.paid){
|
2024-10-14 18:02:05 +08:00
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: '订单已支付',
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
2024-09-30 18:02:38 +08:00
|
|
|
|
return; // 阻止后续代码执行
|
|
|
|
|
|
}
|
|
|
|
|
|
if (this.agree==false) {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: '请勾选协议',
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
return; // 阻止后续代码执行
|
|
|
|
|
|
}
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
modelId: this.modelId,
|
|
|
|
|
|
ruleId: this.chosePriceInfo.ruleId,
|
|
|
|
|
|
agentId: this.agentInfo.agentId,
|
|
|
|
|
|
num: this.timenum,
|
|
|
|
|
|
address: this.address,
|
|
|
|
|
|
pickupLon: this.addlon,
|
|
|
|
|
|
pickupLat: this.addlat,
|
|
|
|
|
|
storeId: this.storeId,
|
|
|
|
|
|
type:1
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
let timeStr = this.time.replace('年', '-').replace('月', '-').replace('日', '').trim() + ':00';
|
|
|
|
|
|
data.pickupTime = timeStr;
|
|
|
|
|
|
|
|
|
|
|
|
if (this.typeidx == 0) {
|
|
|
|
|
|
if (!this.address || !this.addlat || !this.addlon) {
|
|
|
|
|
|
uni.showToast({
|
2024-10-14 18:02:05 +08:00
|
|
|
|
title: '请选择上门送车位置',
|
2024-09-30 18:02:38 +08:00
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
return; // 阻止后续代码执行
|
|
|
|
|
|
}
|
|
|
|
|
|
if (this.agentInfo.isFreeCar) {
|
|
|
|
|
|
data.deliveryMethod = 2;
|
|
|
|
|
|
} else {
|
|
|
|
|
|
data.deliveryMethod = 3;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
data.deliveryMethod = 1;
|
|
|
|
|
|
|
|
|
|
|
|
// 当 typeidx 为 1 时，检查 address、addlat 和 addlon 是否有值
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.$u.post(`appVerify/createOrder`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
|
title:'加载中'
|
|
|
|
|
|
})
|
2024-10-14 18:02:05 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
console.log(res);
|
2024-10-14 18:02:05 +08:00
|
|
|
|
let that=this
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// this.freList=res.rows
|
|
|
|
|
|
uni.requestPayment({
|
|
|
|
|
|
provider: 'wxpay',
|
|
|
|
|
|
timeStamp: res.data.response.timeStamp,
|
|
|
|
|
|
nonceStr: res.data.response.nonceStr,
|
|
|
|
|
|
package: res.data.response.packageVal,
|
|
|
|
|
|
signType: res.data.response.signType,
|
|
|
|
|
|
paySign: res.data.response.paySign,
|
2024-10-14 18:02:05 +08:00
|
|
|
|
success(ress) {
|
|
|
|
|
|
this.paid=true
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// that.ispaid = false
|
2024-10-14 18:02:05 +08:00
|
|
|
|
console.log('支付成功');
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// // 支付成功逻辑
|
|
|
|
|
|
// clearInterval(that.timer)
|
|
|
|
|
|
// that.orderinfo = {}
|
|
|
|
|
|
// that.showdevice = false
|
|
|
|
|
|
// that.deviceIndex = 0
|
|
|
|
|
|
uni.hideLoading()
|
|
|
|
|
|
uni.redirectTo({
|
|
|
|
|
|
url:'/page_user/user_order?orderNo='+res.data.orderNo
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
fail(err) {
|
|
|
|
|
|
// that.ispaid = false
|
|
|
|
|
|
console.log(res);
|
|
|
|
|
|
// 支付失败逻辑
|
|
|
|
|
|
// uni.showToast({
|
|
|
|
|
|
// title: '支付失败',
|
|
|
|
|
|
// icon: 'none',
|
|
|
|
|
|
// duration: 1000
|
|
|
|
|
|
// });
|
|
|
|
|
|
uni.hideLoading()
|
|
|
|
|
|
uni.redirectTo({
|
|
|
|
|
|
url:'/page_user/user_order?orderNo='+res.data.orderNo
|
|
|
|
|
|
})
|
|
|
|
|
|
// setTimeout(()=>{
|
|
|
|
|
|
|
|
|
|
|
|
// },1100)
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
// 成功处理逻辑
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
backDedu(info) {
|
|
|
|
|
|
if (info == 0) {
|
|
|
|
|
|
return '免费取消'
|
|
|
|
|
|
} else {
|
|
|
|
|
|
return '扣费' + info * 100 + '%'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
getToken() {
|
|
|
|
|
|
this.$u.post(`/getToken`).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
toWord(num) {
|
|
|
|
|
|
if (num == 1) {
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
} else {
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
}
|
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
|
url: '/page_user/word?id=' + 9
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
getMapLocation() {
|
|
|
|
|
|
uni.chooseLocation({
|
|
|
|
|
|
success: (res) => {
|
|
|
|
|
|
console.log(res);
|
|
|
|
|
|
this.address = res.address
|
|
|
|
|
|
this.addlon = res.longitude
|
|
|
|
|
|
this.addlat = res.latitude
|
|
|
|
|
|
// this.getRegionFn(res);
|
|
|
|
|
|
},
|
|
|
|
|
|
fail: () => {
|
|
|
|
|
|
// 如果用uni.chooseLocation没有获取到地理位置，则需要获取当前的授权信息，判断是否有地理授权信息
|
|
|
|
|
|
uni.getSetting({
|
|
|
|
|
|
success: (res) => {
|
|
|
|
|
|
console.log(res);
|
|
|
|
|
|
var status = res.authSetting;
|
|
|
|
|
|
if (!status['scope.userLocation']) {
|
|
|
|
|
|
// 如果授权信息中没有地理位置的授权，则需要弹窗提示用户需要授权地理信息
|
|
|
|
|
|
uni.showModal({
|
|
|
|
|
|
title: "是否授权当前位置",
|
|
|
|
|
|
content: "需要获取您的地理位置，请确认授权，否则地图功能将无法使用",
|
|
|
|
|
|
success: (tip) => {
|
|
|
|
|
|
if (tip.confirm) {
|
|
|
|
|
|
// 如果用户同意授权地理信息，则打开授权设置页面，判断用户的操作
|
|
|
|
|
|
uni.openSetting({
|
|
|
|
|
|
success: (data) => {
|
|
|
|
|
|
// 如果用户授权了地理信息在，则提示授权成功
|
|
|
|
|
|
if (data
|
|
|
|
|
|
.authSetting[
|
|
|
|
|
|
'scope.userLocation'
|
|
|
|
|
|
] === true
|
|
|
|
|
|
) {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: "授权成功",
|
|
|
|
|
|
icon: "success",
|
|
|
|
|
|
duration: 1000
|
|
|
|
|
|
})
|
|
|
|
|
|
// 授权成功后，然后再次chooseLocation获取信息
|
|
|
|
|
|
uni.chooseLocation({
|
|
|
|
|
|
success: (
|
|
|
|
|
|
res
|
|
|
|
|
|
) => {
|
|
|
|
|
|
console
|
|
|
|
|
|
.log(
|
|
|
|
|
|
"详细地址",
|
|
|
|
|
|
res
|
|
|
|
|
|
);
|
|
|
|
|
|
// this.getRegionFn(res);
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: "授权失败",
|
|
|
|
|
|
icon: "none",
|
|
|
|
|
|
duration: 1000
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
fail: (res) => {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: "调用授权窗口失败",
|
|
|
|
|
|
icon: "none",
|
|
|
|
|
|
duration: 1000
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
mapFun() {
|
|
|
|
|
|
console.log('点击了');
|
|
|
|
|
|
uni.openLocation({
|
|
|
|
|
|
latitude: this.storeInfo.lat,
|
|
|
|
|
|
//纬度 - 目的地/坐标点
|
|
|
|
|
|
longitude: this.storeInfo.lng,
|
|
|
|
|
|
//经度 - 目的地/坐标点
|
|
|
|
|
|
// name: "荆门市",
|
|
|
|
|
|
address: this.storeInfo.simpleAddress
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
backTime() {
|
|
|
|
|
|
if (this.chosePriceInfo.rentalUnit) {
|
|
|
|
|
|
// 将 this.time 转换为 Date 对象
|
|
|
|
|
|
const timeParts = this.time.match(/(\d{4})年(\d{2})月(\d{2})日 (\d{2}):(\d{2})/);
|
|
|
|
|
|
const startTime = new Date(
|
|
|
|
|
|
`${timeParts[1]}-${timeParts[2]}-${timeParts[3]}T${timeParts[4]}:${timeParts[5]}`);
|
|
|
|
|
|
|
|
|
|
|
|
// 确定要增加的时间单位
|
|
|
|
|
|
let multiplier = this.timenum;
|
|
|
|
|
|
switch (this.chosePriceInfo.rentalUnit) {
|
2024-10-23 18:02:59 +08:00
|
|
|
|
case 'hours':
|
2024-09-30 18:02:38 +08:00
|
|
|
|
startTime.setHours(startTime.getHours() + multiplier);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'day':
|
|
|
|
|
|
startTime.setDate(startTime.getDate() + multiplier);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'week':
|
|
|
|
|
|
startTime.setDate(startTime.getDate() + multiplier * 7);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'month':
|
|
|
|
|
|
startTime.setMonth(startTime.getMonth() + multiplier);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'quarter':
|
|
|
|
|
|
startTime.setMonth(startTime.getMonth() + multiplier * 3);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'year':
|
|
|
|
|
|
startTime.setFullYear(startTime.getFullYear() + multiplier);
|
|
|
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
|
|
|
console.error('Unknown rental unit:', this.chosePriceInfo.rentalUnit);
|
|
|
|
|
|
}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// 格式化返回时间
|
|
|
|
|
|
const year = startTime.getFullYear();
|
|
|
|
|
|
const month = (startTime.getMonth() + 1).toString().padStart(2, '0');
|
|
|
|
|
|
const day = startTime.getDate().toString().padStart(2, '0');
|
|
|
|
|
|
const hours = startTime.getHours().toString().padStart(2, '0');
|
|
|
|
|
|
const minutes = startTime.getMinutes().toString().padStart(2, '0');
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
// 返回归还时间
|
|
|
|
|
|
return `${year}年${month}月${day}日 ${hours}:${minutes}`;
|
|
|
|
|
|
}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
},
|
|
|
|
|
|
getPrice() {
|
|
|
|
|
|
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
modelId: this.modelId,
|
2024-10-14 18:02:05 +08:00
|
|
|
|
type:'1',
|
2024-09-30 18:02:38 +08:00
|
|
|
|
ruleId: this.chosePriceInfo.ruleId,
|
|
|
|
|
|
agentId: this.agentInfo.agentId,
|
|
|
|
|
|
num: this.timenum
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if (this.typeidx == 0) {
|
|
|
|
|
|
if (this.agentInfo.isFreeCar) {
|
|
|
|
|
|
data.deliveryMethod = 2
|
|
|
|
|
|
} else {
|
2024-10-14 18:02:05 +08:00
|
|
|
|
data.deliveryMethod = 3
|
2024-09-30 18:02:38 +08:00
|
|
|
|
}
|
|
|
|
|
|
} else {
|
2024-10-14 18:02:05 +08:00
|
|
|
|
data.deliveryMethod = 1
|
2024-09-30 18:02:38 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.$u.post(`app/calculatePrice`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.priceInfo = res.data
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
addnum() {
|
|
|
|
|
|
this.timenum++
|
|
|
|
|
|
this.getPrice()
|
|
|
|
|
|
},
|
|
|
|
|
|
subtractnum() {
|
|
|
|
|
|
if (this.timenum > 1) {
|
|
|
|
|
|
this.timenum--;
|
|
|
|
|
|
this.getPrice()
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
changePrice(item, idx) {
|
|
|
|
|
|
this.chosePriceInfo = item
|
|
|
|
|
|
this.priceIndex = idx
|
|
|
|
|
|
this.getPrice()
|
|
|
|
|
|
},
|
|
|
|
|
|
confirm1(selectedDate) {
|
|
|
|
|
|
// 将用户选择的日期和当前日期进行比较
|
|
|
|
|
|
// 从回调中获取选择的月份、日期、小时和分钟
|
|
|
|
|
|
const selectedMonth = parseInt(selectedDate.month, 10);
|
|
|
|
|
|
const selectedDay = parseInt(selectedDate.day, 10);
|
|
|
|
|
|
const selectedHour = selectedDate.hour;
|
|
|
|
|
|
const selectedMinute = selectedDate.minute;
|
|
|
|
|
|
|
|
|
|
|
|
// 获取当前日期
|
|
|
|
|
|
const now = new Date();
|
|
|
|
|
|
const currentYear = now.getFullYear();
|
|
|
|
|
|
const currentMonth = now.getMonth();
|
|
|
|
|
|
const currentDay = now.getDate();
|
|
|
|
|
|
|
|
|
|
|
|
// 比较选择的日期和当前日期
|
|
|
|
|
|
if (selectedMonth < currentMonth || (selectedMonth === currentMonth && selectedDay < currentDay)) {
|
|
|
|
|
|
// 如果选择的日期比当前日期早，则重置为当前日期时间
|
|
|
|
|
|
const month = currentMonth < 10 ? `${currentMonth}` : currentMonth;
|
|
|
|
|
|
const day = currentDay < 10 ? `${currentDay}` : currentDay;
|
|
|
|
|
|
const hour = now.getHours() < 10 ? `${now.getHours()}` : now.getHours();
|
|
|
|
|
|
const minute = now.getMinutes() < 10 ? `${now.getMinutes()}` : now.getMinutes();
|
|
|
|
|
|
|
|
|
|
|
|
this.time = `${currentYear}年${month}月${day}日 ${hour}:${minute}`;
|
|
|
|
|
|
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: '选择的日期不能小于当前日期',
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// 否则，设置为用户选择的日期和时间
|
|
|
|
|
|
const month = selectedMonth < 10 ? `${selectedMonth}` : selectedMonth;
|
|
|
|
|
|
const day = selectedDay < 10 ? `${selectedDay}` : selectedDay;
|
|
|
|
|
|
const hour = selectedHour < 10 ? `${selectedHour}` : selectedHour;
|
|
|
|
|
|
const minute = selectedMinute < 10 ? `${selectedMinute}` : selectedMinute;
|
|
|
|
|
|
|
|
|
|
|
|
this.time = `${currentYear}年${month}月${day}日 ${hour}:${minute}`;
|
|
|
|
|
|
}
|
|
|
|
|
|
console.log(this.time);
|
|
|
|
|
|
},
|
|
|
|
|
|
getKm() {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
lon: this.gps.longitude,
|
|
|
|
|
|
lat: this.gps.latitude,
|
|
|
|
|
|
storeId: this.storeId
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$u.get(`app/computeDistance?`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
|
|
|
|
|
|
let distance = res.data; // 获取返回的距离
|
|
|
|
|
|
|
|
|
|
|
|
// 判断距离单位，如果小于1000米则显示米，大于等于1000米则显示千米
|
|
|
|
|
|
if (distance < 1000) {
|
|
|
|
|
|
this.km = `${distance.toFixed(0)}m`; // 小于1000米，保留整数并拼接'm'
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.km = `${(distance / 1000).toFixed(1)}km`; // 大于等于1000米，转换为千米并保留两位小数
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
timetype(time) {
|
2024-10-14 18:02:05 +08:00
|
|
|
|
if (time == 'hours') {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
return '小时'
|
|
|
|
|
|
} else if (time == 'day') {
|
|
|
|
|
|
return '天'
|
|
|
|
|
|
} else if (time == 'week') {
|
|
|
|
|
|
return '周'
|
|
|
|
|
|
} else if (time == 'month') {
|
|
|
|
|
|
return '月'
|
|
|
|
|
|
} else if (time == 'quarter') {
|
|
|
|
|
|
return '季度'
|
|
|
|
|
|
} else if (time == 'year') {
|
|
|
|
|
|
return '年'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
changeType(num) {
|
|
|
|
|
|
this.typeidx = num
|
|
|
|
|
|
this.$nextTick(() => {
|
2024-10-14 18:02:05 +08:00
|
|
|
|
this.getPrice()
|
2024-09-30 18:02:38 +08:00
|
|
|
|
this.calculateDistance(num);
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
getpriceList() {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
modelId: this.modelId
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$u.get(`app/getRuleByModelId?`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.priceList = res.data;
|
|
|
|
|
|
this.chosePriceInfo = this.priceList[0]
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
this.getPrice()
|
|
|
|
|
|
}, 300)
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
getmodelInfo() {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
modelId: this.modelId
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$u.get(`app/getModelById?`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.modelInfo = res.data
|
|
|
|
|
|
this.getpriceList()
|
|
|
|
|
|
this.getAgent()
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
getAgent() {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
agentId: this.modelInfo.agentId
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$u.get(`app/getAgentByAgentId?`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.agentInfo = res.data;
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
getstoreInfo() {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
storeId: this.storeId
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$u.get(`app/getStore?`, data).then((res) => {
|
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
|
this.storeInfo = res.data
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.showToast({
|
|
|
|
|
|
title: res.msg,
|
|
|
|
|
|
icon: 'none',
|
|
|
|
|
|
duration: 2000
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
calculateDistance(num) {
|
|
|
|
|
|
if (num == 0) {
|
|
|
|
|
|
console.log('00');
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
const query = uni.createSelectorQuery().in(this);
|
|
|
|
|
|
|
|
|
|
|
|
query.select('#startType').boundingClientRect(startRect => {
|
|
|
|
|
|
if (!startRect) {
|
|
|
|
|
|
// console.error('#startType element not found');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
query.select('#endType').boundingClientRect(endRect => {
|
|
|
|
|
|
if (!endRect) {
|
|
|
|
|
|
// console.error('#endType element not found');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.height = endRect.top - startRect.bottom;
|
|
|
|
|
|
}).exec();
|
|
|
|
|
|
|
|
|
|
|
|
}).exec();
|
|
|
|
|
|
}, 100);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
console.log('11');
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
const query = uni.createSelectorQuery().in(this);
|
|
|
|
|
|
|
|
|
|
|
|
query.select('#startType1').boundingClientRect(startRect => {
|
|
|
|
|
|
if (!startRect) {
|
|
|
|
|
|
// console.error('#startType1 element not found');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
query.select('#endType1').boundingClientRect(endRect => {
|
|
|
|
|
|
if (!endRect) {
|
|
|
|
|
|
// console.error('#endType1 element not found');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
this.height = endRect.top - startRect.bottom;
|
|
|
|
|
|
}).exec();
|
|
|
|
|
|
|
|
|
|
|
|
}).exec();
|
|
|
|
|
|
}, 100);
|
|
|
|
|
|
}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
|
page {
|
|
|
|
|
|
background-color: #F7F7F7;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.page {
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
padding-bottom: 220rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.tips_box {
|
|
|
|
|
|
padding: 48rpx 30rpx;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
left: 82rpx;
|
|
|
|
|
|
top: 410rpx;
|
|
|
|
|
|
width: 590rpx;
|
|
|
|
|
|
// height: 282rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
|
|
|
|
|
z-index: 110;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
|
|
|
|
.tit {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt {
|
|
|
|
|
|
margin-top: 32rpx;
|
|
|
|
|
|
width: 506rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
|
|
margin-top: 46rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 506rpx;
|
|
|
|
|
|
height: 78rpx;
|
|
|
|
|
|
background: #4297F3;
|
|
|
|
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.sub_box {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
|
|
|
|
|
|
.detail {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
padding: 36rpx;
|
|
|
|
|
|
border-radius: 30rpx 30rpx 0 0;
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.tit {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.close {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 36rpx;
|
|
|
|
|
|
top: 36rpx;
|
|
|
|
|
|
width: 34rpx;
|
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt_li {
|
|
|
|
|
|
margin-top: 22rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.txt5 {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bot_box {
|
|
|
|
|
|
padding: 28rpx;
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
height: 198rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.price_box {
|
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.price {
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #FF1C1C;
|
|
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 52rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.mx {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-left: 32rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
|
|
|
|
|
|
.icon-xiangxia {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
margin-left: auto;
|
|
|
|
|
|
width: 340rpx;
|
|
|
|
|
|
height: 84rpx;
|
|
|
|
|
|
background: #4297F3;
|
|
|
|
|
|
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.xiey {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.yuan {
|
|
|
|
|
|
width: 32rpx;
|
|
|
|
|
|
height: 32rpx;
|
|
|
|
|
|
border: 1rpx solid #3D3D3D;
|
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
width: 32rpx;
|
|
|
|
|
|
height: 32rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt3,
|
|
|
|
|
|
.txt4 {
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
white-space: nowrap; // 防止换行
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt3 {
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt4 {
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_box {
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
padding: 18rpx 24rpx;
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
|
|
|
|
|
|
.tit {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt2 {
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble {
|
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_top {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
|
|
|
|
|
|
.tabbl_left {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 93rpx;
|
|
|
|
|
|
background: #D8D8D8;
|
|
|
|
|
|
border-radius: 30rpx 0 0 0;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
border-right: 1rpx solid #fff;
|
|
|
|
|
|
border-bottom: 1rpx solid #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_right {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 93rpx;
|
|
|
|
|
|
background: #D8D8D8;
|
|
|
|
|
|
border-radius: 0 30rpx 0 0;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
border-bottom: 1rpx solid #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_cont:last-child {
|
|
|
|
|
|
.tabbl_left {
|
|
|
|
|
|
border-radius: 0 0 0 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_right {
|
|
|
|
|
|
border-radius: 0 0 30rpx 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_cont {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
|
|
|
|
|
|
.tabbl_left {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 93rpx;
|
|
|
|
|
|
background: #EFEFEF;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
border-right: 1rpx solid #fff;
|
|
|
|
|
|
border-bottom: 1rpx solid #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tabble_right {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 93rpx;
|
|
|
|
|
|
background: #EFEFEF;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
border-bottom: 1rpx solid #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.insurance_box {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
padding: 18rpx 24rpx;
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
|
|
|
|
|
|
.choose_insurance_box::-webkit-scrollbar {
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.choose_insurance_box {
|
|
|
|
|
|
margin-top: 26rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap; // 确保子元素在一行内排列
|
|
|
|
|
|
|
|
|
|
|
|
overflow-x: auto; // 启用水平滚动条
|
|
|
|
|
|
white-space: nowrap; // 确保子元素不换行
|
|
|
|
|
|
|
|
|
|
|
|
.insurance_li {
|
|
|
|
|
|
margin-right: 14rpx;
|
|
|
|
|
|
width: 280rpx;
|
|
|
|
|
|
height: 607rpx;
|
|
|
|
|
|
background: #F6F6F6;
|
|
|
|
|
|
border-radius: 20rpx;
|
|
|
|
|
|
flex-shrink: 0; // 防止子元素缩小，确保宽度固定
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.info {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
.left {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
|
|
|
|
|
|
.txt1 {
|
|
|
|
|
|
margin-left: 12rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #0D75E5;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right_txt {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.backcolor {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
height: 102rpx;
|
|
|
|
|
|
border-radius: 30rpx 30rpx 0 0;
|
|
|
|
|
|
background: linear-gradient(180deg, rgba(158, 250, 174, 0.38) 0%, rgba(149, 244, 165, 0) 100%);
|
|
|
|
|
|
// z-index: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tit_box {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #16BC32;
|
|
|
|
|
|
|
|
|
|
|
|
.txt {
|
|
|
|
|
|
margin-left: 12rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #16BC32;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.yj_box {
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
padding: 18rpx 24rpx;
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
|
|
|
|
|
|
.tipstxt {
|
|
|
|
|
|
margin-top: 18rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #808080;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tip_box {
|
|
|
|
|
|
margin-top: 22rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
padding: 30rpx 34rpx;
|
|
|
|
|
|
background: #EFFDF4;
|
|
|
|
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.tops {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
margin-right: 4rpx;
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.words {
|
|
|
|
|
|
margin-top: 14rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt_box {
|
|
|
|
|
|
margin-top: 14rpx;
|
|
|
|
|
|
padding: 0 32rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
.txt {
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.yj_line {
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
padding: 0 44rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
|
|
.yuan {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 108rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
border-radius: 26rpx 26rpx 26rpx 26rpx;
|
|
|
|
|
|
border: 1rpx solid #808080;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #808080;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.line {
|
|
|
|
|
|
flex-grow: 1;
|
|
|
|
|
|
height: 1rpx;
|
|
|
|
|
|
border-bottom: 1rpx dashed #80808080;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.top_txt {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
.txts {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tips_btn {
|
|
|
|
|
|
// width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
|
|
|
|
|
|
.icon-xiangyou1 {
|
|
|
|
|
|
font-size: 20rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time_card {
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
padding: 18rpx 24rpx;
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
|
|
|
|
|
|
.num_box {
|
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
|
|
.lefttxt {
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.txt {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.choosnum {
|
|
|
|
|
|
margin-left: 22rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.left {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 65rpx;
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
border: 2rpx solid #808080;
|
|
|
|
|
|
border-radius: 30rpx 0 0 30rpx;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
width: 22rpx;
|
|
|
|
|
|
height: 22rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.cont {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 99rpx;
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
border-bottom: 2rpx solid #808080;
|
|
|
|
|
|
border-top: 2rpx solid #808080;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 65rpx;
|
|
|
|
|
|
height: 56rpx;
|
|
|
|
|
|
border: 2rpx solid #808080;
|
|
|
|
|
|
border-radius: 0rpx 30rpx 30rpx 0;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
width: 22rpx;
|
|
|
|
|
|
height: 22rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tit {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.choose_box {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
margin-top: 12rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.choose_li:nth-child(4n) {
|
|
|
|
|
|
margin-right: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.choose_li {
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
margin-right: 14rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
// display: flex;
|
|
|
|
|
|
// flex-wrap: wrap;
|
|
|
|
|
|
// align-items: center;
|
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
width: 150rpx;
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
background: #F0F5F6;
|
|
|
|
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
|
|
|
|
padding-top: 20rpx;
|
|
|
|
|
|
border: 2rpx solid #fff;
|
|
|
|
|
|
|
|
|
|
|
|
.time {
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.price {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #FF1C1C;
|
|
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
|
font-size: 44rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.hot {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
background: #CCE5FF;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 35rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
border-radius: 0 0 12rpx 12rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.act1 {
|
|
|
|
|
|
border: 2rpx solid #4297F3;
|
|
|
|
|
|
background: #DCEDFF;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab-container {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
border-bottom: 2px solid #ddd;
|
|
|
|
|
|
/* 底部边框 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab-item {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
padding: 10px 20px;
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
color: #666;
|
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab-item.active {
|
|
|
|
|
|
color: #333;
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab-item.active::after {
|
|
|
|
|
|
content: '';
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: -2px;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 4px;
|
|
|
|
|
|
background-color: #2e9afe;
|
|
|
|
|
|
/* 下划线颜色 */
|
|
|
|
|
|
border-radius: 50px;
|
|
|
|
|
|
/* 圆角效果，模拟弧线 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.delivery_cont {
|
|
|
|
|
|
width: 696rpx;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
// height: 488rpx;
|
|
|
|
|
|
|
|
|
|
|
|
// background: #FFFFFF;
|
|
|
|
|
|
.delivery_info {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
padding: 30rpx 20rpx;
|
|
|
|
|
|
border-radius: 0 0 30rpx 30rpx;
|
|
|
|
|
|
|
|
|
|
|
|
@mixin same-height-as-getcar {
|
|
|
|
|
|
height: 100%; // 设置为 getcar 高度
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.type1 {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.lins {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 30rpx;
|
|
|
|
|
|
top: 46rpx;
|
|
|
|
|
|
flex-grow: 1;
|
|
|
|
|
|
width: 2rpx;
|
|
|
|
|
|
|
|
|
|
|
|
border-left: 1rpx dashed #D8D8D8;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.maps {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
z-index: 100;
|
2024-09-19 17:33:39 +08:00
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
top: 100rpx;
|
|
|
|
|
|
width: 166rpx;
|
|
|
|
|
|
height: 166rpx;
|
|
|
|
|
|
background-image: url('https://lxnapi.ccttiot.com/bike/img/static/uiIqqyZ7lKmwHShwdb7e');
|
|
|
|
|
|
background-size: cover;
|
|
|
|
|
|
/* 背景图片等比缩放以覆盖整个容器 */
|
|
|
|
|
|
background-position: center;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
top: 30rpx;
|
|
|
|
|
|
width: 96rpx;
|
|
|
|
|
|
height: 98rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.getcar {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
|
|
|
|
|
|
.li {
|
|
|
|
|
|
margin-top: 8rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
.input {
|
|
|
|
|
|
width: 510rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
margin-left: 6rpx;
|
|
|
|
|
|
width: 32rpx;
|
|
|
|
|
|
height: 32rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2024-09-19 17:33:39 +08:00
|
|
|
|
.type {
|
|
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 68rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
|
|
|
|
border: 2rpx solid #4297F3;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.txt {
|
|
|
|
|
|
|
|
|
|
|
|
margin-left: 18rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.types {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 68rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
background: #DCEDFF;
|
|
|
|
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 20rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.backtype {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
width: 68rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #16BC32;
|
|
|
|
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
|
|
|
|
border: 2rpx solid #16BC32;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tips {
|
|
|
|
|
|
|
|
|
|
|
|
margin-left: 18rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.delivery_top {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
|
|
|
|
|
|
.delivery_left {
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
|
background: #EEEEEE;
|
|
|
|
|
|
border-radius: 60rpx 0 0 0;
|
|
|
|
|
|
|
|
|
|
|
|
.cont {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
padding-top: 26rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 60rpx 60rpx 0 0;
|
|
|
|
|
|
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
width: 92rpx;
|
|
|
|
|
|
height: 16rpx;
|
|
|
|
|
|
left: 114rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.delivery_right {
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
height: 100rpx;
|
2024-09-30 18:02:38 +08:00
|
|
|
|
background: #fff;
|
2024-09-19 17:33:39 +08:00
|
|
|
|
border-radius: 0rpx 60rpx 0 0rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.cont {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
padding-top: 26rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
width: 100%;
|
2024-09-30 18:02:38 +08:00
|
|
|
|
background: #eee;
|
2024-09-19 17:33:39 +08:00
|
|
|
|
height: 100%;
|
2024-09-30 18:02:38 +08:00
|
|
|
|
border-radius: 0rpx 60rpx 0 60rpx;
|
2024-09-19 17:33:39 +08:00
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #808080;
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
width: 92rpx;
|
|
|
|
|
|
height: 16rpx;
|
|
|
|
|
|
left: 114rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2024-09-30 18:02:38 +08:00
|
|
|
|
|
|
|
|
|
|
.leftact {
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
border-radius: 60rpx 0 0 0;
|
|
|
|
|
|
|
|
|
|
|
|
.cont {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background: #eee;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 60rpx 0 60rpx 0;
|
|
|
|
|
|
color: #808080;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.rightact {
|
|
|
|
|
|
background: #eee;
|
|
|
|
|
|
border-radius: 0 60rpx 0 0;
|
|
|
|
|
|
|
|
|
|
|
|
.cont {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 60rpx 60rpx 0 0;
|
|
|
|
|
|
color: #808080;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2024-09-19 17:33:39 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.car_info {
|
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
|
margin-top: -200rpx;
|
|
|
|
|
|
width: 698rpx;
|
|
|
|
|
|
height: 196rpx;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
padding: 0 24rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.left {
|
|
|
|
|
|
.name {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
color: #3D3D3D;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.car_type_li {
|
|
|
|
|
|
margin-top: 16rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
.type {
|
2024-09-30 18:02:38 +08:00
|
|
|
|
margin-right: 12rpx;
|
2024-09-19 17:33:39 +08:00
|
|
|
|
padding: 4rpx 10rpx;
|
|
|
|
|
|
background: #DCEDFF;
|
|
|
|
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
|
color: #4297F3;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
image {
|
|
|
|
|
|
width: 156rpx;
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.fixed {
|
|
|
|
|
|
z-index: 999;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.backimg {
|
|
|
|
|
|
|
|
|
|
|
|
// position: fixed;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
z-index: -10;
|
|
|
|
|
|
width: 750rpx;
|
|
|
|
|
|
height: 428rpx;
|
|
|
|
|
|
background: linear-gradient(180deg, #CCE5FF 0%, rgba(204, 229, 255, 0) 100%);
|
|
|
|
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
