车主停车页面

src/assets/css/xpwyfyy.css

@@ -251,65 +251,6 @@ body {
 	margin: 50px auto
 }
 
-@media (max-width: 320px) {
-	.mui-grid-view.mui-grid-9 .mui-table-view-cell.inedxfyy-grid-agin {
-		padding: 0
-	}
-	.mui-table-view-cell.inedxfyy-grid-big>a:not(.mui-btn) {
-		height: 190px
-	}
-	.mui-grid-view.mui-grid-9 .mui-media .mui-icon {
-		font-size: 26px
-	}
-	.mui-grid-view.mui-grid-9 .mui-table-view-cell>a:not(.mui-btn) {
-		padding: 5px 0
-	}
-	.notice-fyy .mui-media-body,
-	body,
-	input,
-	select,
-	textarea,
-	.mui-input-group .mui-input-row .mui-btn {
-		font-size: 14px
-	}
-	.mui-content .faceaifyy-content.mui-content-padded {
-		height: 240px
-	}
-	.mui-content .faceaifyy-content-text {
-		padding: 0
-	}
-	.bindfyy-btn {
-		margin: 20px auto
-	}
-	.mui-input-group .mui-input-row p {
-		font-size: 14px
-	}
-	.mui-content .vongi-choose .mui-table-view-cell a {
-		padding: 11px 15px
-	}
-	.mui-content .vongi-photo {
-		height: 240px
-	}
-	.mui-content .vongi-meform-pho .mui-table-view-cell a {
-		padding: 3px 5px
-	}
-	.mui-table-view-cell .vongi-color-block .mui-media-body {
-		font-size: 16px
-	}
-	.vongi-color-block .mui-h1.vongi-color-icon {
-		font-size: 35px
-	}
-	.vongi-sqtpdat-slider.fyy-slider .mui-table-view .mui-table-view-cell .mui-media-object {
-		height: 100px!important
-	}
-	.fyy-scon-top .fyy-scon-head {
-		height: 150px;
-	}
-	.vongi-kqtj-time {
-		font-size: 50%
-	}
-}
-
 .bindfyy-btn button {
 	line-height: 26px;
 	width: 100%
@@ -4557,3 +4498,172 @@ h3 {
 .fyy-cartg ul li .mui-h3{
 	margin-bottom:5px
 }
+.vongi-car-banner{
+	background:url(../img/car_bannerBg.png) no-repeat center;
+	background-size:100% 100%;
+	padding:20px
+	}
+.vongi-car-banner h5{
+	color:white;
+	text-shadow: 0 5px 5px rgba(0,0,0,0.2);
+	font-weight: bold;
+	margin-bottom:10px
+}
+.vongi-car-banner input{
+	border-top-left-radius: 5px;
+	border-bottom-left-radius: 5px;
+	border-top-right-radius: 0;
+	border-bottom-right-radius: 0;
+	font-size:18px;
+	padding:6px 15px
+}
+.vongi-car-banner button{
+	border-top-left-radius: 0;
+	border-bottom-left-radius: 0;
+	border-top-right-radius:5px;
+	border-bottom-right-radius: 5px;
+	padding:6px 20px;
+	font-size:16px;
+}
+.vongi-car-banner .flew{
+	box-shadow: 0 2px 5px rgba(0,0,0,0.2);;
+}
+.vongi-car-footer{
+	position:absolute;
+	bottom:0;
+	padding:20px;
+}
+.vongi-car-footer .mui-media-body{
+	background:#DBDEE3;
+	padding:15px;
+	border-radius: 5px;
+}
+.vongi-car-not{
+	padding:20px;
+	text-align: center;
+}
+.vongi-car-not img{
+	width:80%
+}
+.vongi-car-pay{
+	background:url(../img/car_bannerBg2.jpg) no-repeat top;
+	background-size:100%;
+	padding:20px;
+	margin-top:44px;
+	
+}
+.mui-bar-nav ~ .mui-content.vongi-car-pay{
+	padding-top:0
+}
+.vongi-car-pay-top{
+	text-align: center;
+	color:white;
+	padding:30px 0;
+	line-height: 1;
+}
+
+.vongi-car-pay .mui-h1{
+	font-size:48px;
+	font-weight: bold;
+}
+.vongi-car-pay .vongi-cd-payli .mui-input-row:nth-child(2){
+	padding-top:0
+}
+.vongi-car-pay .vongi-cd-payli .mui-input-row:last-child{
+	padding-bottom:0
+}
+.vongi-car-pay form{
+	padding:15px 0;
+	border-radius: 10px;
+	background:white
+}
+.vongi-car-pay form label{
+	color:#666
+}
+.vongi-car-pay .vongi-qingjiadt .mui-content-padded{
+	margin:15px
+}
+.vongi-car-over{
+	padding-top:20%;
+	text-align: center;
+}
+.vongi-car-over img {
+    width: 100px;
+    
+}
+.vongi-car-over h2{
+	font-weight: bold;
+	margin-bottom:10px
+}
+.vongi-car-over-line {
+    width: 200px;
+    height: 1px;
+    border-bottom: 1px #BBBBBB dotted;
+    margin: 20px auto;
+}
+.padd30{
+	padding:30px
+}
+@media (max-width: 320px) {
+	.mui-grid-view.mui-grid-9 .mui-table-view-cell.inedxfyy-grid-agin {
+		padding: 0
+	}
+	.mui-table-view-cell.inedxfyy-grid-big>a:not(.mui-btn) {
+		height: 190px
+	}
+	.mui-grid-view.mui-grid-9 .mui-media .mui-icon {
+		font-size: 26px
+	}
+	.mui-grid-view.mui-grid-9 .mui-table-view-cell>a:not(.mui-btn) {
+		padding: 5px 0
+	}
+	.notice-fyy .mui-media-body,
+	body,
+	input,
+	select,
+	textarea,
+	.mui-input-group .mui-input-row .mui-btn {
+		font-size: 14px
+	}
+	.mui-content .faceaifyy-content.mui-content-padded {
+		height: 240px
+	}
+	.mui-content .faceaifyy-content-text {
+		padding: 0
+	}
+	.bindfyy-btn {
+		margin: 20px auto
+	}
+	.mui-input-group .mui-input-row p {
+		font-size: 14px
+	}
+	.mui-content .vongi-choose .mui-table-view-cell a {
+		padding: 11px 15px
+	}
+	.mui-content .vongi-photo {
+		height: 240px
+	}
+	.mui-content .vongi-meform-pho .mui-table-view-cell a {
+		padding: 3px 5px
+	}
+	.mui-table-view-cell .vongi-color-block .mui-media-body {
+		font-size: 16px
+	}
+	.vongi-color-block .mui-h1.vongi-color-icon {
+		font-size: 35px
+	}
+	.vongi-sqtpdat-slider.fyy-slider .mui-table-view .mui-table-view-cell .mui-media-object {
+		height: 100px!important
+	}
+	.fyy-scon-top .fyy-scon-head {
+		height: 150px;
+	}
+	.vongi-kqtj-time {
+		font-size: 50%
+	}
+}
+@media (min-width: 768px) {
+	.vongi-car-pay{
+		background-size: 100% 200px;
+	}
+}

src/projects/parking/views/Car/Pay.vue

@@ -1,5 +1,48 @@
 <template>
-	<div></div>
+	<div>
+		<header id="header" class="mui-bar mui-bar-nav">
+			<h1 class="mui-title">停车缴费</h1>
+			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
+		</header>
+		<div class="mui-content vongi-car-pay">
+			<div class="vongi-car-pay-top">
+				<h4>停车费</h4>
+				<div class="mui-h1">
+					12.00
+				</div>
+			</div>
+			<div class="vongi-qingjiadt">
+				<form class="mui-input-group vongi-cd-payli">
+					<div class="mui-input-row">
+						<label>车牌号</label>
+						<span class="flew">鄂D90909<a href="" class="color4fc5f7 marginl5">修改</a> </span>
+					</div>
+					<div class="mui-input-row">
+						<label>停车位置</label>
+						<span>金盆岭停车场</span>
+					</div>
+					<div class="mui-input-row">
+						<label>入场时间</label>
+						<span>2021-03-04 12:00:00</span>
+					</div>
+					<div class="mui-input-row">
+						<label>出厂时间</label>
+						<span>2021-03-04 12:00:00</span>
+					</div>
+				</form>
+				<div class="mui-content-padded flew-sp">
+					使用优惠券
+					<a href="" class="color4fc5f7">[停车]5元停车抵用券</a>
+				</div>
+			</div>
+		</div>
+		<div class="vongi-cashier-btn-row">
+			<div class="vongi-cashier-btn-white">
+				<span>应缴金额：￥7.00</span>
+				<div class="vongi-cashier-btn">支付离场</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
@@ -28,6 +71,7 @@
 	}
 </script>
 
-
+<style scoped src="$project/assets/css/xpwyfyy.css"></style>
+<style src="$project/assets/css/iconfont.css"></style>
 <style scoped>
 </style>

src/projects/parking/views/Car/PayResult.vue

@@ -1,4 +1,30 @@
 <template>
+<div>
+	<header id="header" class="mui-bar mui-bar-nav">
+			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
+			<h1 class="mui-title">停车收费</h1>
+		</header>
+		<div class="mui-content">
+			<div class="vongi-car-over">
+				<img src="~$project/assets/img/car_yes.png" />
+				<h2>成功缴费12元</h2>
+				<div class="colorfe616c">请在30分钟内离开停车场，<br>超出时间段将可能产生新的费用</div>
+				<div class="vongi-car-over-line"></div>
+				<p>停车时长：1小时20分钟</p>
+				<p>入场时间：07-12 13:51</p>
+				<p>离场时间：07-12 16:30</p>
+			</div>	
+			<!--缴费失败-->
+			<!-- <div class="vongi-car-over">
+				<img src="~$project/assets/img/car_fail.png" />
+				<h2>缴费失败!</h2>
+				<div>请重新扫码再试一次，如无法登记车牌，<br>请联系车场管理员。</div>
+			</div>	 -->
+		</div>
+		<div class="fyy-footer padd30">
+			<div class="bindfyy-btn"><button type="submit" class="mui-btn mui-btn-primary ">返  回</button></div>
+		</div>
+</div>
 </template>
 
 <script>
@@ -27,5 +53,7 @@
 	}
 </script>
 
+<style scoped src="$project/assets/css/xpwyfyy.css"></style>
+<style src="$project/assets/css/iconfont.css"></style>
 <style>
 </style>

src/projects/parking/views/Car/Search.vue

@@ -1,4 +1,29 @@
 <template>
+<div>
+	<header id="header" class="mui-bar mui-bar-nav">
+			<h1 class="mui-title">车牌查询</h1>
+			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
+		</header>
+		<div class="mui-content vongi-car-index">
+			<div class="vongi-car-banner">
+				<h5 class="mui-ellipsis">停车位置：金盆洗脚城(金盆岭店)</h5>
+				<div class="flew">
+					<input type="text" onfocus="show(this,'tn')"placeholder="请输入车牌号查询">
+					<button class="mui-btn mui-btn-blue">查询</button>
+				</div>
+			</div>
+			<div class="vongi-car-not">
+				<img src="~$project/assets/img/car_not.png">
+				<div class="mui-text-center">没有找到停车信息!</div>
+			</div>
+		</div>
+		<div class="vongi-car-footer">
+			<div class="mui-media-body">
+				<b>停车场收费说明:</b><br>
+				缴费后请于规定时间离场，离场会自动抬杆。如果找不到停车信息，或者临牌停车，请至集中缴费处缴纳现金。
+			</div>
+		</div>			
+</div>
 </template>
 
 <script>
@@ -27,5 +52,7 @@
 	}
 </script>
 
+<style scoped src="$project/assets/css/xpwyfyy.css"></style>
+<style src="$project/assets/css/iconfont.css"></style>
 <style>
 </style>