<template>
	<scroll-view scroll-y="true" 
    style="height: 100vh;" @scroll="handleScroll">
        <view class="nav-box row items-center" :style="{paddingTop:barHeight+'px',height:(barHeight+44)+'px',opacity:`${scrollTop}%`}">
			<view class="home-btn row items-center" @click="goHomeHandle">
				<u-icon name="home_1" custom-prefix="tffont" color="#111" size="38" style="font-weight: bolder;"></u-icon>
			</view>
			<view class="title">接送机/包车</view>
		</view>
        <view class="busHeader" v-if="scrollTop<50">
            <busHeader :title="pageTitle"></busHeader>
        </view>
		<view class="bus-home">
			<view class="bus-home-header">
				<view class="title-box">
					<view class="titleBox"
                    :class="[busInfor.CarType<3?'active-item':'']"
                    @click="setType(0)">
						<view class="right" v-if="busInfor.CarType<3"></view>
						<text>接送机</text>
					</view>
                    <view class="titleBox Right" 
                    :class="[busInfor.CarType==3?'active-item':'']"
                    @click="setType(3)">
                        <view class="right" v-if="busInfor.CarType==3"></view>
						<text>包车</text>
					</view>
				</view>
				<view class="bus-tools column">
                    <template v-if="busInfor.CarType<3">
                        <view class="row items-center" 
                        style="padding:36rpx 18rpx 18rpx 18rpx;">
                            <label class="bus-radio row items-center"
                            v-for="(item, index) in radioList" :key="item.value"
                            @click="radioChange(item.value)"
                            >
                                <view class="bus-radioLeft">{{item.name}}</view>
                                <view class="bus-radioRight row items-center justify-center"
                                :class="[current==item.value?'active':'']">
                                    <view v-if="current==item.value"></view>
                                </view>
                            </label>
                        </view>
                        <template v-if="busInfor.CarType==1">
                            <view class="row items-center bus-input">
                                <text class="bus-inputText"
                                :style="{color: busInfor.AirportName?'#080A09':'#BCBCBC'}"
                                @click="clickAirport">
                                    {{busInfor.AirportName?busInfor.AirportName:busInfor.CarType==1?'出发地：选择机场':'目的地：选择机场'}}
                                </text>
                            </view>
                            <view class="row items-center bus-input">
                                <text class="bus-inputText"
                                :style="{color: busInfor.destination?'#080A09':'#BCBCBC'}"
                                @click="getTheCar=1,citiesVisible=true">
                                {{busInfor.destination?busInfor.destination:busInfor.CarType==1?'目的地：地址或酒店':'出发地：地址或酒店'}}
                                </text>
                            </view>
                        </template>
                        <template v-if="busInfor.CarType==2">
                            <view class="row items-center bus-input">
                                <text class="bus-inputText"
                                :style="{color: busInfor.startaddress?'#080A09':'#BCBCBC'}"
                                @click="getTheCar=3,citiesVisible=true">
                                {{busInfor.startaddress?busInfor.startaddress:busInfor.CarType==1?'目的地：地址或酒店':'出发地：地址或酒店'}}
                                </text>
                            </view>
                            <view class="row items-center bus-input">
                                <text class="bus-inputText"
                                :style="{color: busInfor.AirportName?'#080A09':'#BCBCBC'}"
                                @click="clickAirport">
                                    {{busInfor.AirportName?busInfor.AirportName:busInfor.CarType==1?'出发地：选择机场':'目的地：选择机场'}}
                                </text>
                            </view>
                        </template>
                        
                        <view class="bus-input row-sbas-n" style="padding:36rpx 18rpx;">
                            <view class="row">
                                <text class="bus-inputText" :style="{color: busInfor.time?'#080A09':'#BCBCBC'}" @click="showDateHandle">
                                    {{busInfor.time?busInfor.time:'接载时间'}}
                                </text>
                                <u-icon name="arrow" :size="32" color="#000" style="position: relative;top: 2rpx;"></u-icon>
                            </view>
                            <view class="row" @click="peopleVisible=true">
                                <text>共{{busInfor.peopleNum}}人</text>
                                <u-icon name="arrow" :size="32" color="#000" style="position: relative;top: 2rpx;"></u-icon>
                            </view>
                        </view>
                    </template>
                    <template v-if="busInfor.CarType==3">
                        
                        <!--
                        <scroll-view scroll-y="true"
                        style="height: 346rpx;overflow: hidden;margin-bottom: 30rpx;">
                            <view class="busPlaceForm row-sb-w">
                                <view class="busPlaceBox" v-for="(item,index) in PlaceList"
                                :class="[busInfor.CountryId==item.Country?'active':'']"
                                :key="index" @click="busInfor.CountryId=item.Country">
                                    <view>{{ item.CountryName }}</view>
                                </view>
                            </view>
                        </scroll-view>-->
                        <view class="row items-center bus-input">
                            <text class="bus-inputText"
                            :style="{color: busInfor.startaddress?'#080A09':'#BCBCBC'}"
                            @click="getTheCar=3,citiesVisible=true">
                            {{busInfor.startaddress?busInfor.startaddress:'出发地：地址或酒店'}}
                            </text>
                        </view>
                        <view class="row items-center bus-input">
                            <text class="bus-inputText"
                            :style="{color: busInfor.destination?'#080A09':'#BCBCBC'}"
                            @click="getTheCar=2,citiesVisible=true">
                            {{busInfor.destination?busInfor.destination:'目的地：地址或酒店'}}
                            </text>
                        </view>
                        <view class="bus-input row-sbas-n" @click="showDateHandle" style="padding:36rpx 18rpx;">
                            <view class="row">
                                <text class="bus-inputText" :style="{color: busInfor.time?'#080A09':'#BCBCBC'}">
                                    {{busInfor.time?busInfor.time:'接载时间'}}
                                </text>
                            </view>
                            <u-icon name="arrow" :size="32" color="#000" style="position: relative;top: 2rpx;"></u-icon>
                            <!--
                            <view class="row" @click="peopleVisible=true">
                                <text>包车{{busInfor.days}}天</text>
                                <u-icon name="arrow" :size="32" color="#000" style="position: relative;top: 2rpx;"></u-icon>
                            </view>-->
                        </view>
                    </template>
					
					<view @click="searchHandle" class="text-center cities-name" style="background-color: #B99846;border-radius: 10rpx;height: 90rpx; line-height: 90rpx;color:#EEF1F4">查 询</view>
					
					<u-popup mode="bottom" border-radius="20" 
                    :popup="false" 
                    v-model="peopleVisible" :maskCloseAble="true" 
                    length="649" :safeAreaInsetBottom="true" 
                    @close="popupClose" :z-index="9999">
                        <view class="peopleBox">
                            <template v-if="busInfor.CarType<3">
                                <view class="peopleTitle"> 
                                    <view>乘客数量</view>  
                                    <view class="peopleClose" @click="peopleVisible=false">取消</view>  
                                </view>
                                <view class="peopleCenter row-sbas-n">
                                    <view class="peopleCenterL column">
                                        <view>乘客人数</view>
                                        <view>包含成人和儿童</view>
                                    </view>
                                    <view class="peopleCenterR row items-center">
                                        <input type="number" v-model="busInfor.peopleNum" @change="getPeople"/>
                                        <text>人</text>    
                                    </view>
                                </view>
                            </template>
                            <template v-if="busInfor.CarType==3">
                                <view class="peopleTitle"> 
                                    <view>包车数量</view>  
                                    <view class="peopleClose" @click="peopleVisible=false">取消</view>  
                                </view>
                                <view class="peopleCenter row-sbas-n">
                                    <view class="peopleCenterL column">
                                        <view>包车天数</view>
                                        <view></view>
                                    </view>
                                    <view class="peopleCenterR row items-center">
                                        <input type="number" v-model="busInfor.days" @change="getPeople"/>
                                        <text>天</text>    
                                    </view>
                                </view>
                            </template>
                            <u-button :custom-style="btnStyle2" @click="peopleVisible=false">确定</u-button>
                        </view>
					</u-popup>
                    <!--接送时间-->
                    <u-picker v-model="dateVisible" 
                    mode="time" 
                    :startYear="startYear"
                    :params="dateParams"
                    @cancel="setDateHandler"
                    @confirm="setDateHandler"
                    confirmColor="#B99846"
                    ></u-picker>
                    <!--机场选择-->
                    <u-popup mode="bottom" border-radius="20" 
                    :popup="false" 
                    v-model="AirportVisable" :maskCloseAble="true" 
                    length="100%" :safeAreaInsetBottom="true" 
                    @close="popupClose" :z-index="9999">
                        <airport :msg="busInfor"
                        @change="getAirport"
                        @close="popupClose"></airport>
                    </u-popup>
                    <!--上下车点-->
                    <u-popup mode="bottom" border-radius="20" 
                    :popup="false" 
                    v-model="citiesVisible" :maskCloseAble="true" 
                    length="100%" :safeAreaInsetBottom="true" 
                    @close="popupClose" :z-index="9999">
                        <alightingPoint :msg="busInfor"
                        :type="getTheCar"
                        @change="getAirport"
                        @close="popupClose"></alightingPoint>
                    </u-popup>
				</view>
			</view>
		</view>
	</scroll-view>
	
</template>

<script>
    import busHeader from '@/components/header/header.vue';
    import airport from './components/address/airport.vue';
    import alightingPoint from './components/address/alightingPoint.vue';
	export default {
        components:{
            busHeader,
            airport,
            alightingPoint
        },
		data() {
			return {
                pageTitle: '接送机/包车',
				scrollTop:0,
				citiesVisible:false,
                peopleVisible:false,
				dateVisible:false,
				barHeight:0,
                current:1,
                radioList:[
                    {name: '接机',value: 1},
                    {name: '送机',value: 2},
                ],
                busInfor:{
                    CarType: 1,
                    CountryId: null,
                    CountryName: '',
                    CityId: null,
                    CityName: '',
                    desCountryId: null,
                    desCountryName: '',
                    desCityId: null,
                    desCityName: '',
                    ThreeCode: '',// 三字码
                    AirportId: null,
                    AirportName: '',
                    startaddress: '',
                    destination: '',
                    time: '',
                    peopleNum: 1,
                    days: 1,
                    oriLatitude: '',// 出发地纬度
                    oriLongitude: '',
                    desLatitude: '',// 目的地纬度
                    desLlongitude: '',
                    Range: 0, // 距离
                },
                dateParams:{
                	year: true,
                    month: true,
                    day: true,
                    hour: true,
                    minute: true,
                },
                PlaceList: [],
                airportList: [],
                AirportVisable: false,
                btnStyle2: {
                    borderRadius: "18rpx",
                    color: "#fff",
                    fontSize: "30rpx",
                    width: "100%",
                    background: "#B99846",
                    
                },
                getTheCar: 1,//1 接机下车  2送机下车 3上车
                startYear: 2025,
			}
		},
		created() {
            this.startYear = this.$utils.GetDateFewFaysLater(0).year
		},
		mounted() {
			let that = this
			uni.getSystemInfo({
				success(r) {
					that.barHeight = r.statusBarHeight
				},
			});
            // this.getAirportList()
		},
		methods: {
            getAirport(msg,type){
                console.log(msg,'---',type)
                if(msg.CountryId!=this.busInfor.CountryId){
                    if(msg.CarType==1){
                        msg.destination = ''
                        msg.desLatitude = ''
                        msg.desLongitude = ''
                    }
                    if(msg.CarType==2){
                    	msg.startaddress = ''
                        msg.oriLatitude = ''
                        msg.oriLongitude = ''
                    }
                }
                this.busInfor = msg
                if(type==2&&(msg.CountryId!=msg.desCountryId)){
                    this.busInfor.CountryId = null
                    this.busInfor.CountryName = ''
                    this.busInfor.CityId = null
                    this.busInfor.CityName = ''
                    this.busInfor.AirportId = null
                    this.busInfor.AirportName = ''
                }else{
                    if(msg.oriLatitude!=''&&msg.desLatitude!=''){
                        this.calculateDistance()
                    }
                }
                this.popupClose()
            },
            // 计算两点距离（Haversine 公式）
            calculateDistance() {
                // 解析输入的经纬度
                const [lat1, lng1] = [this.busInfor.oriLatitude, this.busInfor.oriLongitude]
                const [lat2, lng2] = [this.busInfor.desLatitude, this.busInfor.desLongitude]
                // 输入校验
                if (isNaN(lat1) ||isNaN(lng1) ||isNaN(lat2) ||isNaN(lng2) ) {
                    uni.showToast({
                        title: "请输入有效的经纬度（例如：39.9088,116.3975）",
                        icon: "none"
                    });
                    return;
                }

                // 转换为弧度
                const toRadians = degree => (degree * Math.PI) / 180;
                const φ1 = toRadians(lat1);
                const φ2 = toRadians(lat2);
                const Δφ = toRadians(lat2 - lat1);
                const Δλ = toRadians(lng2 - lng1);

                // Haversine 公式计算
                const a =
                    Math.sin(Δφ / 2) ** 2 +
                    Math.cos(φ1) * Math.cos(φ2) * Math.sin(Δλ / 2) ** 2;
                const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
                // const distance = 6371000 * c; // 地球半径 6371 km → 单位：米
                const distance = 6371 * c; // 地球半径 6371 km → 单位：米

                this.busInfor.Range = distance;
                console.log(`两点之间的距离为：${distance.toFixed(2)} 公里`);
            },

            // 校验经纬度是否合法
            isValidCoordinate(lat, lng) {
                console.log(lat,'---',lng)
                return (
                    lat >= -90 &&
                    lat <= 90 &&
                    lng >= -180 &&
                    lng <= 180 &&
                    Number.isFinite(lat) &&
                    Number.isFinite(lng)
                );
            },
            getPeople(){
                if(this.busInfor.CarType<3&&(this.busInfor.peopleNum<1||!this.busInfor.peopleNum)) this.busInfor.peopleNum = 1
                if(this.busInfor.CarType==3&&(this.busInfor.days<1||!this.busInfor.days)) this.busInfor.peopleNum = 1
            },
            setType(type){
                if(type) {
                    if(this.busInfor.CarType!=type){
                        this.busInfor.CountryId = null
                        this.busInfor.CityId = null
                        this.busInfor.CityName = ''
                        this.busInfor.desCountryId = null
                        this.busInfor.desCityId = null
                        this.busInfor.desCityName = ''

                        this.busInfor.CarType = type
                        this.busInfor.startaddress = ''
                        this.busInfor.destination = ''
                        this.busInfor.AirportId = null
                        this.busInfor.AirportName = ''
                    }
                    // this.getPlaceList()
                }else {
                    if(this.busInfor.CarType!=this.current ){
                        this.busInfor.CountryId = null
                        this.busInfor.CityId = null
                        this.busInfor.CityName = ''
                        this.busInfor.desCountryId = null
                        this.busInfor.desCityId = null
                        this.busInfor.desCityName = ''

                        this.busInfor.CarType = this.current 
                        this.busInfor.startaddress = ''
                        this.busInfor.destination = ''
                        this.busInfor.AirportId = null
                        this.busInfor.AirportName = ''
                    }
                    // this.getAirportList()
                }
            },
            clickAirport(){
                // if(this.airportList.length==0){
                //     return uni.showToast({
                //         title: '请选择出发地',
                //         icon: 'none'
                //     })	
                // }
                this.AirportVisable=true
            },
            setAirportHandle(e){
                this.busInfor.AirportId = this.airportList[0].AirportId
                this.busInfor.AirportName = this.airportList[0].AirportName
                
            },
            getAirportList(){
                this.airportList = []
                this.apipost('CarSingle_post_GetCarSingleAllAirportList',{
                    Type: this.busInfor.CarType,
                    CountryId: this.busInfor.CountryId,
                    CityId: this.busInfor.CityId,
                },res=>{
                    if(res.resultCode==1&&res.data.length>0){
                        this.airportList = res.data[0].AirportList
                        res.data.forEach(x=>{
                            x.AirportList.forEach(y=>{
                            	this.airportList.push(y)
                            })
                        })
                    }
                })
            },
            getPlaceList(){
                this.apipost('CarSingle_post_GetCarSingleAllPlaceList',{
                    Type: this.busInfor.CarType,
                    AirportId: 0
                },res=>{
                    if(res.resultCode==1){
                        this.PlaceList = res.data
                        // this.busInfor.CountryId = res.data[0].Country
                        // this.busInfor.CountryName = res.data[0].CountryName
                        // this.busInfor.CityId = res.data[0].CityList[0].City
                    }
                })
            },
            radioChange(e){
                if(this.busInfor.CarType!=e){
                    this.busInfor.CountryId = null
                    this.busInfor.CityId = null
                    this.busInfor.CityName = ''
                    this.busInfor.desCountryId = null
                    this.busInfor.desCityId = null
                    this.busInfor.desCityName = ''
                }
                if(this.current!=e){
                    this.busInfor.CarType = e
                    this.current = e

                    this.busInfor.startaddress = ''
                    this.busInfor.destination = ''
                    this.busInfor.AirportId = null
                    this.busInfor.AirportName = ''
                }
                
            },
			searchHandle(){
                if(this.busInfor.CarType<3){
                    if(!this.busInfor.AirportName){
                        return uni.showToast({
                            title: '请选择出发地',
                            icon: 'none'
                        })
                    }
                    if(!this.busInfor.destination){
                        return uni.showToast({
                            title: '请输入目的地',
                            icon: 'none'
                        })
                    }
                }
                if(this.busInfor.CarType==3){
                    if(this.busInfor.startaddress==''){
                        return uni.showToast({
                            title: '请选择出发地',
                            icon: 'none'
                        })
                    }else if(this.busInfor.destination==''){
                        return uni.showToast({
                            title: '请选择目的地',
                            icon: 'none'
                        })
                    }
                }
                if(!this.busInfor.time){
                    return uni.showToast({
                        title: '请选择接载时间',
                        icon: 'none'
                    })
                }
				uni.setStorage({
                    key: "busInfor",
					data: JSON.stringify(this.busInfor)
				})
				uni.navigateTo({
                    url:'/pages/bus/busList'
                })
			},
			popupClose(){
				this.citiesVisible = false
				this.dateVisible = false
				this.peopleVisible = false
                this.AirportVisable = false
			},
			showDateHandle(){
				this.dateVisible=true
			},
			setCityHandler(val){
                this.busInfor = val
				this.citiesVisible = false
                // this.getAirportList()
			},
			setDateHandler(val){
                this.busInfor.time = `${val.year}-${val.month}-${val.day} ${val.hour}:${val.minute}`
				this.dateVisible = false
			},
			handleScroll(val){
				this.scrollTop = val.target.scrollTop
			},
			goHomeHandle(){
				uni.redirectTo({
					url:'/pages/index/index'
				})
			}
		}
	}
</script>

<style scoped>
	@import url("../../asset/css/flex.css");
	.nav-box{
		height: 44px; /* 这里的44px是示例高度，可根据实际设计调整 */
		line-height: 44px;
		background-color: #FFF;
		color: #fff;
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		z-index: 2;
		padding-left: 30rpx;
	}
	.nav-box .home-btn{
		width: 60rpx;
		height:60rpx;
		border-radius: 60rpx;
		border:2rpx solid #ccc;
		display: flex;
		align-items: center;
		justify-content: center;
		
	}
	.nav-box .title{
		font-weight: bold;
		font-size: 32rpx;
		color: #080A09;
		text-align: center;
		width: calc(100vw - 140px);
	}
	.nav-box .home-btn:active{
		background-color: #ccc;
	}
	.bus-home {
		background-color: #F3F1EF;
		min-height: 100vh;
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638813466842071842.png');
		background-repeat: no-repeat;
		background-size: 100% auto;
		padding: 0 30rpx;
		padding-top: 357rpx;
		padding-bottom: 36rpx;
	}
	.bus-low-rank{
		margin-top: 36rpx;
		border-radius: 16rpx;
		padding: 4rpx;
		background-color: #FFF;
	}
	.bus-low-rank .header{
		height: 115rpx;
		background: linear-gradient(180deg, #F8EFDD, #FEFEFD);
		border-radius: 16rpx 16rpx 0rpx 0rpx;
		padding: 0 28rpx;
	}
	.bus-low-rank .header .city-box{
		background-color: rgba(185, 152, 70, 0.3);
		height: 42rpx;
		border-radius: 21rpx;
		padding: 0 14rpx;
		font-weight: bold;
		font-size: 28rpx;
		color: #080A09;
	}
	.bus-low-rank .city-list-item{
		font-weight: bold;
		font-size: 32rpx;
		color: #080A09;
		margin-left: 18rpx;
	}
	.bus-low-rank .city-list-item .info-text{
		font-size: 24rpx;
		color: #A4A4A4;
		font-weight: 400;
	}
	.bus-low-rank .city-list-item .rank{
		width: 50rpx;
		height: 62rpx;
		line-height: 56rpx;
		text-align: center;
		font-size: 30rpx;
		font-weight: 500;
		color: #080A09AA;
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749695490481809.png');
		background-size: 100% 100%;
	}
	.bus-low-rank .city-list-item .rank.num1{
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749695490598524.png');
		color: #FFFFFFAA;
	}
	.bus-low-rank .city-list-item .rank.num2{
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749695489392934.png');
		color: #FFFFFFAA;
	}
	.bus-low-rank .city-list-item .rank.num3{
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749695489378365.png');
		color: #FFFFFFAA;
	}
	.bus-low-rank .city-list-item .more-date{
		padding: 12rpx;
		border-radius: 29rpx;
		background-color: #f1f1f1;
		color: #000000DD;
		font-size: 22rpx;
		font-weight: 400;
	}
	.bus-home-header {
		border-radius: 18rpx;
		background-color: #FFF;
	}

	.bus-home-header .title-box {
		height: 79rpx;
		background: #EDEEEE;
		position: relative;
		border-top-right-radius: 18rpx;
        border-top-left-radius: 18rpx;
	}
	.bus-home-header .title-box .titleBox {
		position: absolute;
		padding-top: 30rpx;
		border-top-right-radius: 18rpx;
		border-top-left-radius: 18rpx;
		top: -10rpx;
		width: 310rpx;
		bottom: 0;
		left: 0;
		text-align: center;
		font-weight: bold;
		font-size: 32rpx;
		
	}
    .bus-home-header .title-box .titleBox.active-item{
        background-color: #fff;
        color: #B99846;
    }
    .bus-home-header .title-box .titleBox.Right{
        right: 0;
        left: inherit;
    }

	.bus-home-header .title-box .active-item .right {
		width: 75rpx;
		height: 89rpx;
		position: absolute;
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638745412034709773.png');
		background-size: 100% 100%;
		right: -62rpx;
		top: 0;
	}
    .bus-home-header .title-box .Right .right {
		width: 75rpx;
		height: 89rpx;
		position: absolute;
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638813747126234769.png');
		background-size: 100% 100%;
		left: -60rpx;
		top: 0;
	}

	.bus-home .bus-home-header .bus-tools {
		padding: 0 36rpx 60rpx 36rpx;
	}

	.bus-tools .cities-name {
		font-weight: bold;
		font-size: 32rpx;
		color: #080A09;
	}

	.bus-tools .normal-label {
		font-size: 24rpx;
		color: #9999A6;
	}

	.bus-tools .exchange {
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1696990221000_663.png');
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 38rpx auto;
		/* 这里设置背景图片的宽度和高度 */
		height: 30px;
	}
    .busHeader{
        height: 200rpx;
        position: fixed;
        left: 0;
        right: 0;
    }
    .bus-radio:last-child{
        margin-left: 137rpx;
    }
    .bus-radioLeft{
        margin-right: 23rpx;
        font-weight: bold;
        font-size: 32rpx;
        color: #080A09;
    }
    .bus-radioRight{
        width: 29rpx;
        height: 28rpx;
        border-radius: 50%;
        border: 2rpx solid #BCBCBC;
    }
    .bus-radioRight view{
        width: 18rpx;
        height: 17rpx;
        background: #B99846;
        border-radius: 50%;
    }
    .bus-radioRight.active{
        border-color: #B99846;
    }
    .bus-input{
        border-bottom: 1px solid #F1F4F6;
        padding:42rpx 18rpx; 
        font-size: 32rpx;
    }
    .bus-inputText{
        color: #BCBCBC;
    }
    .bus-inputText::placeholder{
        color: #BCBCBC;
    }
    .bus-inputLeft{
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .peopleBox{
        padding: 0 40rpx;
    }
    .peopleTitle{
        font-weight: bold;
        font-size: 32rpx;
        color: #080A09;
        position: relative;
        padding: 38rpx 0;
    }
    .peopleTitle view{
        text-align: center;
    }
    .peopleClose{
        position: absolute;
        right: 0;
        top: 37rpx;
        font-weight: bold;
        font-size: 32rpx;
        color: #B99846;
    }
    .peopleCenter{
        padding: 151rpx 0;
    }
    .peopleCenterL view:first-child{
        color: #080A09;
        font-size: 36rpx;
        font-weight: bold;
    }
    .peopleCenterL view:last-child{
        color: #757776;
        font-size: 28rpx;
        font-weight: bold;
    }
    .peopleCenterR input{
        width: 195rpx;
        height: 90rpx;
        text-align: center;
        background: #F1F4F6;
        border-radius: 12rpx;
    }
    .peopleCenterR text{
        font-weight: bold;
        font-size: 36rpx;
        color: #080A09;
        margin-left: 58rpx;
    }
    .busPlaceForm{

    }
    .busPlaceBox{
        width: 298rpx;
        height: 90rpx;
        background: #F1F4F6;
        border-radius: 10rpx;
        font-weight: 500;
        font-size: 32rpx;
        color: #080A09;
        text-align: center;
        line-height: 90rpx;
        margin-bottom: 31rpx;
    }
    .busPlaceBox.active{
        background: #B99846;
        color: #fff;
    }
</style>