zx_flk_app/pages/storeDetails/storeDetails.vue

<template>
	<view class="container">
		<view class="store-img-view">
			
		</view>
		<view class="p-bg">
			<view class="store-info-view">
				<view class="store-name">门店名字</view>
				<view class="flex-row align-center" style="margin-bottom: 24rpx;">
					<view class="store-type">租车</view>
					<view class="store-type">租车</view>
					<view class="store-type">租车</view>
					<view class="store-num-type"> <text class="store-num">7</text> 款车型</view>
					<view class="store-phone"><img style="width: 84rpx;height: 64rpx;" src="https://qiniu.bms16.com/Ft0YA1JYmq66hdoeEN-PgBHy5vLa" alt=""></view>
				</view>
				<view class="flex-row flex-between">
					<view :class="isWorkTimer ? 'left_grid_2' : 'left_grid_1'">
						<view class="flex-row">
							<img style="width: 40rpx;height: 40rpx;"
								:src="!isWorkTimer ? 'https://zxappfile.bms16.com/zx_admin/cab_timer.png' : 'https://zxappfile.bms16.com/zx_admin/cab_timer_work.png'">
							<view :class="isWorkTimer ? 'grid_text_1' : 'grid_text_rest' ">{{isWorkTimer ? '营业中' : '已休息'}}
							</view>
						</view>
						<view class="grid_text_2">{{shopInfo.work_begin_time}}-{{shopInfo.work_end_time}}</view>
					</view>
					<view @tap="bindToNav" class="right_grid flex-between">
						<view>
							<view class="cab_distance">
								直线距您{{distance}}
							</view>
							<view class="cab_address">{{shopInfo.address}}</view>
						</view>
						<view >
							<img class="icon_grid_1" src="https://zxappfile.bms16.com/zx_admin/cab_nav.png">
							<view class="grid_nav">导航</view>
						</view>
					</view>
				</view>
			</view>
			<view class="tip-view">
				<view class="tip-title-view flex-row align-center">
					<img style="width: 144rpx;height: 40rpx;" src="https://qiniu.bms16.com/FjUW1kuRvXWTEftyn9nH1AbGWuxK" alt="">
					<img style="width: 86rpx;height: 80rpx;" src="https://qiniu.bms16.com/FibAaPERzqi6m95EP2jREUKixjUi" alt="">
					<view class="w-bg flex-row"></view>
				</view>
				<view class="step-view flex-row  align-center">
					<view class="icon-list-view"><img src="https://qiniu.bms16.com/Fp0BE27Q0VTD8qUJRHUVhWO6VEbO" alt=""></view>
					<view class="dashed-line"></view>
					<view class="icon-list-view"><img src="https://qiniu.bms16.com/FqDzYwAbnSEgf3yv9SAb92Vq4ZEB" alt=""></view>
					<view class="dashed-line"></view>
					<view class="icon-list-view"><img src="https://qiniu.bms16.com/FlFMHzco6j9XOpMI21tSnR9500Un" alt=""></view>
				</view>
				<view class="step-tip-view flex-row  align-center">
					<view class="step-tip-text"><img class="step-num-1" src="https://qiniu.bms16.com/Fm4gMRmW6UOwLcU-eW8LDLNfiUJe" alt="">线上选择用车方案生成待支付订单</view>
					<view class="step-tip-text"><img class="step-num-2" src="https://qiniu.bms16.com/FvYN7SxOYIhXEqSAJZrQIBQuTx79" alt="">导航到店向商家支付订单金额</view>
					<view class="step-tip-text"><img class="step-num-3" src="https://qiniu.bms16.com/FhZ7w0X8iVuxFPdetEF9C3YYkJ7Z" alt="">支付完成后直接现场取车</view>
				</view>
			</view>
			<view class="unit-type-view">
				<view class="unit-type ">日租</view>
				<view class="unit-type unit-type-i">日租</view>
				<view class="unit-type ">日租</view>
				<view class="unit-type ">日租</view>
			</view>
			<view class="car-info-list-view">
				<view class="car-info-view align-center flex-row">
					<img class="car-img" src="https://qiniu.bms16.com/FsxOysJT2V3KNYev2YWadvjyKn2j" alt="">
					<view class="car-info">
						<view class="car-name flex-row">基础智能电动车</view>
						<view class="car-model-info">续航70km｜重量54kg</view>
						<view class="flex-row flex-between">
							<view class="unit-type-price flex-row"><text style="margin-right: 8rpx;">日租</text><priceTool :price="50" :font_size="40"/></view>
							<view class="lease-btn">立即租</view>
						</view>
					</view>
				</view>
			</view>
			
		</view>
	</view>
</template>
<script module="tools" lang="wxs" src="@/pages/common/wxs/tools.wxs"></script>
<script module="tools" lang="sjs" src="@/pages/common/wxs/tools.sjs"></script>
<script>
	var config = require('../../common/config.js');
	var common = require('../../common/common.js');
	var http = require('../../common/http.js');
	var storage = require('../../common/storage.js');
	import priceTool from '@/component/priceTool/priceTool';
	
	export default {
		components: {
			priceTool
		},
		data() {
			return {
				
			};
		}
		/**
		 * 生命周期函数--监听页面加载
		 */
		,
		onLoad: function(options) {
			
		},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			
		},
		methods: {
		
		}
			
		};
</script>

<style>
	@import './storeDetails.css';
</style>