zx_flk_app/component/carPlan/carPlan.vue

<template>
	<view  class="show-more">
		<view class="more-info">
			<view class="flex-row model-title">
				<view style="margin-right: 24rpx;"><img style="width: 32rpx;height: 32rpx;" src="https://qiniu.bms16.com/FoWVlo-Nmx6wTDpsL2Rf9_BamU7L" alt=""></view>
				<view class="car-model-detail flex-row">
					<!-- <priceTool :price="58" :font_size="40"/> -->
					<allPrice :amount="50"/>
					<view class="car-model-price-view">
						<text style="margin-right: 12rpx;">已选择</text>
						<text>月租</text>
						<text>时长 2 月</text>
						<text>共计60天，橙色</text>
					</view>
					<view class="car-model-tip">现车 随时可到店提车</view>
				</view>
				<view>
					<image style="width: 32rpx;height: 32rpx;" @tap="isShowMore = false"
						src="https://qiniu.bms16.com/FtoTEHOJiUf_gjPCJGGHMsAtHI5M" />
				</view>
			</view>
			<view class="car-plan-view">
				<view class="car-plan-title">用车方案</view>
				<view class="car-plan-list-view flex-row">
					<view class="car-plan-list flex-row">
						<view class="car-plan-unit">日租</view>
						<view class="car-plan-price">$<text style="font-size: 48rpx;margin-left: 6rpx;">29</text></view>
					</view>
					<view class="car-plan-list flex-row">
						<view class="car-plan-unit">日租</view>
						<view class="car-plan-price">$<text style="font-size: 48rpx;margin-left: 6rpx;">29</text></view>
					</view>
					<view class="car-plan-list-i flex-row">
						<view class="car-plan-unit-i">日租</view>
						<view class="car-plan-price-i">$<text style="font-size: 48rpx;margin-left: 6rpx;">29</text></view>
					</view>
				</view>
				<view class="free-num-block">
					<view class="flex-row flex-between" style="margin-bottom: 24rpx;">
						<view class="free-num-left">
							<img style="width: 40rpx;height: 40rpx;" src="https://qiniu.bms16.com/Fj_ifr41AqH2PijZBdOBa3SCxADg" alt="">
							<text style="margin-left: 16rpx;">免费换电次数</text>
						</view>
						<view class="free-num">共60次</view>
					</view>
					<view class="flex-row free-num-tip">本单可享60次免费换电数，超出后需要单独支付换电费用</view>
					<view class="flex-row free-num-tip">自费换电：$1/次</view>
				</view>
				<view class="plan-time flex-row flex-between">
					<view>租车时长</view>
					<view class="quantity-count flex-row flex-between">
						<view class="total-time flex-row">
							 共 
							<view style="font-weight: 600;margin: 0 10rpx;">6</view>
							<!-- <view style="font-weight: 600;margin: 0 10rpx;">{{tools.countToDay(count,isSelectStatus)}}</view> -->
							<text>天</text>
						</view>
						<!-- <view class="count-btn fbtn" @tap.stop.prevent="bindMinus">-</view> -->
						<view @tap.stop.prevent="bindMinus"><img class="count-btn fbtn"
								src="https://qiniu.bms16.com/Fm-SCbzVeVHgQK920bmWNvnJnL32" /></view>
						<input @input="bindInput"  @blur="bindBlur" type="number" :value="count" />
						<!-- <view class="count-btn sbtn" @tap.stop.prevent="bindAdd">+</view> -->
						<view @tap.stop.prevent="bindAdd"><img class="count-btn sbtn"
								src="https://qiniu.bms16.com/FsO-2adBjkUkmk4ENuQco-aK7IyY" /></view>
					</view>
				</view>
				<view class="car-color-view">
					<view>车辆颜色</view>
					<view class="flex-row">
						<view class="car-color-list car-color-s">白色</view>
						<view class="car-color-list car-color-i">白色</view>
						<view class="car-color-list car-color-i">白色</view>
						<view class="car-color-list car-color-i">白色</view>
					</view>
				</view>
			</view>
			<view class="lift-btn-view">
				<view class="lift-btn">确认</view>
			</view>
		</view>
	</view>
</template>

<script>
	import allPrice from '@/component/allPrice/allPrice';
	export default {
		data() {
			return {};
		},
		/**
		 * 组件的属性列表
		 */
		props: {
			count:{
				type:Number,
				default:2
			}
		},
		components: {
			allPrice,
		},
		/**
		 * 组件的方法列表
		 */
		methods: {
		}
	};
</script>
<style scoped>
	@import './carPlan.css';
</style>