jzmall_wx/pages/ucenter/appointOrder/appointOrder.wxml

<view class="container">
	<!-- 地址 -->
	<view class="order-address">
		<!-- 有地址，选择 -->
		<view wx:if="{{addressId>0}}" class="address-select" bindtap="addressSelect">
			<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-order-map.png" class="map-img">
			</image>

			<view class="address-main">
				<view class="main-line">
					<view>{{checkedAddress.name}}</view>
					<view class="phone">{{checkedAddress.tel}}</view>
				</view>
				<view class="customer-address" wx:if="{{checkedAddress.addressName}}">{{checkedAddress.addressName}}{{checkedAddress.detail}}</view>
				<view class="customer-address" wx:else>{{checkedAddress.addressDetail}}</view>
			</view>
			<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/wx-dy/arrow-grey.png" class="arrow-img"></image>

		</view>
		<!-- 没地址，输入 -->
		<view wx:else class="address-input-module add-address">
			<view class="add-form">
				<view class="form-item" bindtap="goMap" style="height:auto;min-height:78rpx; ">
					<view class="label"><text>*</text>服务地址</view>
					<view class="content" style="height:auto;min-height:78rpx; ">
						<view wx:if="{{address.addressName==''}}" style="color: #ACADB1;;font-size:24rpx;" class="input">
							选择省、市、县（区）、乡（镇）
						</view>
						<view wx:else class="input"> {{address.addressName}}</view>
						<!-- <input class="input" value="{{address.addressname}}" disabled="true" placeholder="选择省、市、县（区）、乡（镇）"  placeholder-style="color: #ACADB1;;font-size:24rpx;"/> -->

						<image src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-address-map.png" style="width: 28rpx;height: 28rpx;margin:28rpx 0 0 10rpx;"></image>
					</view>
				</view>
				<view class="form-item">
					<view class="label"><text>*</text>小区门牌</view>
					<view class="content">
						<input class="input" bindinput="bindinputAddress" value="{{address.detail}}" placeholder="详细地址，例xx小区x号楼x单元xx室" placeholder-style="color: #ACADB1;;font-size:24rpx;" />
					</view>
				</view>
				<view class="form-item">
					<view class="label"><text>*</text>联系人</view>
					<view class="content special-content">
						<input class="input" bindinput="bindinputName" placeholder="姓名" value="{{address.name}}" auto-focus placeholder-style="color: #ACADB1;;font-size:24rpx;" />
						<view class="gender-wrapper">
							<view class="female" bindtap="femaleSelect">
								<image src="https://mall.zhaijieshi.cc/file/jzmall-dy/icon-select-popup.png" mode="asceptFit" wx:if="{{gender==2}}"></image>
								<image src="https://mall.zhaijieshi.cc/file/jzmall-dy/icon-unselect-popup.png" mode="asceptFit" wx:else>
								</image>
								<text>女士</text>
							</view>
							<view class="male" bindtap="maleSelect">
								<image src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-select-popup.png" mode="asceptFit" wx:if="{{gender==1}}"></image>
								<image src="https://mall.zhaijieshi.cc/file/jzmall-dy/icon-unselect-popup.png" mode="asceptFit" wx:else>
								</image>
								<text>先生</text>
							</view>


						</view>

					</view>
				</view>
				<view class="form-item">
					<view class="label"><text>*</text>联系电话</view>
					<view class="content">
						<input class="input" bindinput="bindinputMobile" value="{{address.tel}}" type="number" placeholder="手机号码" maxlength="11" placeholder-style="color: #ACADB1;;font-size:24rpx;" />
					</view>
				</view>






			</view>
		</view>

	</view>
	<!-- <view class="address-box">
    <view class="address-item" bindtap="selectAddress" wx:if="{{addressId > 0}}">
      <image class="map-icon" mode="aspectFit" src='https://jzmall.lifejingzhi.com/file/wx-dy/order-map.png'></image>
      <view class="m">
        <text class="address">您的服务地址</text>
        <view class="address-bottom">
          <text class="user-name">{{addressName}}</text>
        </view>
      </view>
      <view class="r">
        <image mode="aspectFit" src='https://jzmall.lifejingzhi.com/file/wx-dy/order-arrow.png'></image>

      </view>
    </view>
    <view class="address-block" bindtap="selectAddress" wx:else>
      <view class="address-wrapper">
        <view class="tips">
          <image src="https://mall.zhaijieshi.cc/file/wx-dy/order-map.png" mode="aspectFit"></image>
          <view>请输入您的详细服务地址</view>
        </view>
        <view class="detail">还没有收货地址，去添加</view>
      </view>
      <image src="https://mall.zhaijieshi.cc/file/wx-dy/order-arrow.png" mode="aspectFit" class="arrow-img"></image>
    </view>

  </view> -->

	<!-- 手机号码 -->
	<!-- <view class="appoint-block">
    <view>手机号码</view> 
    <input placeholder="请输入预约手机号" style="flex: 1;" value="{{mobile}}" placeholder-style="font-size:26rpx;color:rgb(153, 153, 153);text-align:right"
    bindinput="bindPhone" maxlength="11" type="number" />
  </view> -->

	<!-- 预约服务时间 -->
	<view class="appoint-main-module">
		<view class="appoint-block" bindtap="showAppoint">
			<view class="title"><text>*</text>上门时段</view>
			<view class="appoint-time" wx:if="{{appointDate==''}}">服务者将在此时段内上门</view>
			<view class="appoint-timed" wx:else>{{appointDate}}</view>
			<image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img"></image>
		</view>
		<view class="appoint-block" bindtap="showRemarkSelect">
			<view class="title">选择备注</view>
			<view class="appoint-time" wx:if="{{remark==''}}">请选择备注</view>
			<view class="appoint-timed" wx:else>{{remark}}</view>
			<image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img"></image>
		</view>
		<view class="appoint-block">
			<view class="title">补充信息</view>

			<input placeholder="请输入补充信息" class="appoint-timed" value="{{message}}" placeholder-style="font-size:24rpx;color: #ACADB1;" bindinput="bindMessageInput" />
			<image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img"></image>
		</view>
	</view>

	<!-- 预约备注 -->
	<!-- <view class="appoint-block" bindtap="showRemark">
    <view>预约备注</view>
    <view class="appoint-time" wx:if="{{message==''}}">请备注您的需求</view>
    <view wx:else class="remark-text">{{message}}</view>
    <image src="https://mall.zhaijieshi.cc/file/wx-dy/order-arrow.png" mode="aspectFit" class="arrow-img"></image>
  </view> -->

	<!-- 商品 -->
	<view class="product-block">
		<!-- <view class="title">
      服务项目
    </view> -->
		<view class="product-detail">
			<view class="profuct-info">
				<image mode="aspectFit" class="product-img" src="{{orderInfo.picUrl+'?w=200'}}"></image>
				<view class="info-right">
					<view class="info-main">
						<view class="product-name">{{orderInfo.goodsName}}</view>
						<view class="price">¥<text style="font-size: 24rpx;">{{orderInfo.actualPrice}}</text></view>
					</view>
					<view class="sku-name" wx:if="{{orderInfo.increaseSumPrice}}">
						<view> 加购: {{orderInfo.unitDescribe}}*{{orderInfo.unitIncreaseNumber}}</view>
						<view>¥{{orderInfo.increaseSumPrice}}</view>

					</view>
					<view class="sku-name">
						规格:{{orderInfo.skuName}}
					</view>
					<!-- <view class="other-info">规格：1</view> -->
					<view class="other-info">服务{{orderInfo.serviceTimes}}次</view>
					<!-- <view class="other-info">单价：¥{{product.price}}</view> -->
				</view>
			</view>

		</view>


	</view>
	<!-- 订单信息 -->
	<view class="order-info">
		<view class="order-top">
			<view class="topic">
				订单编号：
			</view>
			<view>
				{{orderInfo.orderSn}}
			</view>
			<image mode="aspectFit" class="copy-img" src="https://mall.zhaijieshi.cc/file/jzmall-dy/icon-order-copy.png" bindtap="copyOrder"></image>
		</view>
		<view class="order-top">
			<view class="topic">
				下单时间：
			</view>
			<view>
				{{orderInfo.createTime}}
			</view>
		</view>
		<view class="order-top">
			<view class="topic">
				支付方式：
			</view>
			<view>
				{{orderInfo.payChannel}}
			</view>
		</view>
		<view class="order-bottom">
			<view class="order-price">
				<view class="topic">
					订单金额：
				</view>
				<view>
					¥{{orderInfo.orderPrice}}
				</view>
			</view>
			<view class="coupon-price">
				<view class="topic">
					优惠金额：
				</view>
				<view>
					¥{{orderInfo.discountPrice}}
				</view>
			</view>
			<view class="real-price">
				实际付款：<text>¥{{orderInfo.actualPrice}}</text>
			</view>

		</view>
	</view>
	<!-- 提交按钮 -->
	<view class="appoint-btn" bindtap="submitAll" wx:if="{{!isHide}}">
		立即预约
	</view>

	<!-- 备注弹框 -->
	<view class="appoint-overlay-wrapper" wx:if="{{ remarkShow }}" bindtap="onRemarkClose">
	</view>
	<view class="remark-popup" wx:if="{{ remarkShow }}">
		<view class="title">
			订单备注
		</view>
		<textarea bindinput="bindMessageInput" placeholder="请输入订单备注信息" value="{{message}}" placeholder-style="font-size:26rpx;color:#666;" maxlength="200" class="remark-textarea"></textarea>
		<view class="btn" bindtap="confirmRemark">
			确定
		</view>
	</view>


	<view class="appoint-overlay-wrapper" wx:if="{{ choosePopup }}" bindtap="onClose">
	</view>
	<view class="popup-wrapper popup-wrapper-special" wx:if="{{ choosePopup }}">
		<!-- 标题 -->
		<view class="popup-title popup-title-special popup-title-new">
			<view>选择服务开始时间</view>
			<view wx:if="{{selectTimeValue>=17}}" class="fee-tips">您选的时间段可能会加收夜间服务费，具体以与商家的沟通为准</view>
			<!-- 选择服务者上门时段（具体服务时长以实际服务为准） -->
		</view>

		<block>
			<view class="popup-content popup-content-special">
				<view class="time-select-left">
					<view wx:for="{{dateList}}" wx:key="index" class="time-select-left-item" bindtap="dateCheck" data-index="{{index}}" data-week="{{item.week}}" data-date="{{item.date}}" data-isbook="{{item.isBook}}">
						<view class="{{dateIndex==index?'current-date':''}}">{{item.bookdate+' '+item.weekOfDay}}</view>
						<view>
							<text wx:if="{{index<=1}}" class="date-tag">{{index==0?'今天':'明天'}}</text>
							<!-- <text wx:if="{{item.mark}}" class="full-time">{{item.mark}}</text> -->
						</view>

					</view>
				</view>
				<view class="time-select-right">
					<view class="noon-select">
						<view class="noon-item {{noonType=='1'?'active-noon':''}}" data-noon="1" bindtap="noonTab">上午</view>
						<view class="noon-item {{noonType=='2'?'active-noon':''}}" data-noon="2" bindtap="noonTab">下午</view>
					</view>
					<view class="time-item-wrapper">
						<view wx:for="{{timeList}}" wx:key="id" class="time-select-right-item {{item.timeMsg?'invalid-time':''}}" bindtap="timeCheck" data-stock="{{item.stock}}" data-index="{{index}}" data-msg="{{item.timeMsg}}">
							<!-- <view class="{{item.stock<=0?'zero-stock':''}}"> -->
							<view class="time-line">
								<text class="{{timeIndex===index?'current-date':''}}">{{item.begin}} </text>
								<!-- <text class="stock-text">(库存:{{item.stock}})</text> -->
								<text wx:if="{{selectTimeValue>=17&&timeIndex==index&&(!item.timeMsg)}}" class="extra-tips">收夜间服务费</text>
								<text wx:if="{{timeIndex===index}}" class="date-tag">已选</text>
								<view wx:if="{{item.timeMsg&&item.timeMsg!=null}}" class="time-msg">
									{{item.timeMsg}}
								</view>

							</view>
							<!-- <view wx:if="{{timeIndex===index&&item.value>=17}}" style="font-size: 11px;line-height: 12px;">您选的时间段可能会加收夜间服务费，具体以与商家的沟通为准</view> -->
						</view>
					</view>
				</view>
			</view>
		</block>


		<!-- 确认按钮 -->
		<view class="popup-btn-wrapper">
			<view bindtap="confirmTime" class="confirm-btn">确定</view>
		</view>
	</view>




	<!-- 地址弹框 -->
	<view class="appoint-overlay-wrapper address-overlay" wx:if="{{ addressShow }}" bindtap="onAddressClose">

		<view class="address-popup" cantap="onAddressClick">
			<view class="title">
				选择地址
			</view>
			<view class="address-list">
				<view class="address-item" wx:for="{{addressList}}" wx:key="index" data-address="{{item}}" bindtap="addressConfirm">
					<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-order-map.png" class="map-img"></image>

					<view class="address-main">
						<view class="main-line">
							<view>{{item.name}}</view>
							<view class="phone">{{item.tel}}</view>
						</view>
						<view class="customer-address" wx:if="{{item.addressName}}">{{item.addressName}}{{item.detail}}</view>
						<view class="customer-address" wx:else>{{item.addressDetail}}</view>
					</view>
					<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/wx-dy/arrow-grey.png" class="arrow-img">
					</image>
				</view>
			</view>
			<view class="add-address-btn" bindtap="goAddAddress">添加其他地址</view>
		</view>
	</view>

	<!-- 备注弹框 -->
	<view class="appoint-overlay-wrapper remark-overlay" wx:if="{{ remarkPopupShow }}" bindtap="onRemarkPopupClose">

		<view class="remark-select" catchtap="onRemarkClick">
			<view class="title">
				选择备注
			</view>
			<view class="remark-list">
				<view class="remark-item" wx:for="{{remarkList}}" wx:key="index" data-remark="{{item}}" catchtap="remarkItemSelect">
					<view class="remark-value">{{item}}</view>
					<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-select-popup.png" class="radio-img" wx:if="{{remarkActive==item}}"></image>
					<image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-unselect-popup.png" class="radio-img" wx:else></image>
				</view>
			</view>
			<view class="remark-conf-btn" catchtap="remarkItemConfirm">提交备注</view>
		</view>
	</view>




</view>