0000

pages/singleStart/singleStart.js

@@ -0,0 +1,19 @@
+Page({
+    data: {
+        banner: [],
+        selectIndex: 0
+    },
+    onLoad: function(n) {},
+    onReady: function() {},
+    onShow: function() {},
+    onHide: function() {},
+    onUnload: function() {},
+    onPullDownRefresh: function() {},
+    onReachBottom: function() {},
+    onShareAppMessage: function() {},
+    selectItem: function(n) {
+        this.setData({
+            selectIndex: n.currentTarget.dataset.index
+        });
+    }
+});

pages/singleStart/singleStart.json

@@ -0,0 +1,7 @@
+{
+    "navigationBarTitleText": "聚美汽服",
+    "usingComponents": {
+        "service-tel": "../../template/serviceTel/serviceTel",
+        "head-swiper": "../../template/headSwiper/headSwiper"
+    }
+}

pages/singleStart/singleStart.wxml

@@ -0,0 +1,12 @@
+<view class="container">
+    <head-swiper banner="{{banner}}"></head-swiper>
+    <view class="title-tips">请选择单次洗车金额</view>
+    <view class="list">
+        <view bindtap="selectItem" class="{{selectIndex==index?'active item':'item'}}" data-index="{{index}}" wx:for="{{5}}" wx:key="index"> 6.00元 </view>
+    </view>
+    <service-tel tel="{{servicetel}}"></service-tel>
+    <view class="footer-btn-box">
+        <view class="btn yellow">余额洗车</view>
+        <view class="btn">单次启动</view>
+    </view>
+</view>

pages/singleStart/singleStart.wxss

@@ -0,0 +1,52 @@
+.container {
+    box-sizing: border-box;
+    min-height: 100vh;
+    padding: 0 27rpx 170rpx;
+}
+
+.title-tips {
+    color: #666;
+    font-size: 26rpx;
+    line-height: 90rpx;
+    padding: 0;
+}
+
+.item {
+    background-color: #fff;
+    border-radius: 18rpx;
+    box-shadow: 0 0rpx 9rpx 4rpx hsla(0,0%,40%,.3);
+    color: #333;
+    font-size: 87rpx;
+    height: 180rpx;
+    line-height: 180rpx;
+    margin-bottom: 32rpx;
+    text-align: center;
+}
+
+.item.active {
+    box-shadow: 0 0rpx 9rpx 4rpx rgba(255,102,0,.3);
+    color: #f60;
+}
+
+.footer-btn-box {
+    bottom: 0;
+    color: #fff;
+    display: flex;
+    font-size: 44rpx;
+    left: 0;
+    position: fixed;
+    width: 100vw;
+}
+
+.footer-btn-box .btn {
+    align-items: center;
+    background: #4cadf1;
+    display: inline-flex;
+    flex: 1;
+    height: 104rpx;
+    justify-content: center;
+}
+
+.btn.yellow {
+    background: #fccaa9;
+}