wx-dangyuanjiaoyujidi/unpackage/dist/dev/mp-weixin/pages/visit/book.wxml

<view><view class="content"><view class="box-card"><view class="box-card-title">预约详情</view><view class="box-card-content"><view class="book-box" style="padding-top:20rpx;"><view class="book-box-card"><view class="book-box-title">日期</view><view class="book-box-row"><view class="book-box-row-date"><view class="book-box-row-dateitem book-box-row-dateitem-none"><view class="book-box-row-dateitem-status">售罄</view><view>今天</view><view>5月6日</view></view><view class="book-box-row-dateitem book-box-row-dateitem-on"><view class="book-box-row-dateitem-status"><u-icon vue-id="664ecde0-1" name="checkmark" color="#fff" size="20rpx" bind:__l="__l"></u-icon></view><view>今天</view><view>5月6日</view></view><view class="book-box-row-dateitem"><view class="book-box-row-dateitem-status">余票</view><view>今天</view><view>5月6日</view></view></view><view class="book-box-row-select"><view><view>指定</view><view>日期</view></view><view class="book-box-row-select-more"><u-icon vue-id="664ecde0-2" name="arrow-right" color="#EF9525" size="20rpx" bind:__l="__l"></u-icon></view></view></view></view><view class="book-box-card" style="margin-bottom:0rpx;"><view class="book-box-title">参观时间</view><view class="book-box-timerow"><view class="book-box-row-timeitem"><view class="book-box-row-timeitem-txt">09:00-10:00</view><view class="book-box-row-timeitem-txt">41张</view></view><view class="book-box-row-timeitem"><view class="book-box-row-timeitem-txt">09:00-10:00</view><view class="book-box-row-timeitem-txt">41张</view></view><view class="book-box-row-timeitem book-box-row-timeitem-on"><view class="book-box-row-timeitem-status"><u-icon vue-id="664ecde0-3" name="checkmark" color="#fff" size="20rpx" bind:__l="__l"></u-icon></view><view class="book-box-row-timeitem-txt">09:00-10:00</view><view class="book-box-row-timeitem-txt">41张</view></view></view></view><view class="book-box-selectInfo" style="width:100%;padding:0rpx 13rpx;"><view class="book-box-selectInfo-left">已选：5月6日 09:00-10:00</view><view class="book-box-selectInfo-right"><text class="book-box-selectInfo-righttxt">预约须知</text><u-icon vue-id="664ecde0-4" name="arrow-right" color="#EF9525" size="20rpx" bind:__l="__l"></u-icon></view></view></view></view></view><u--form class="vue-ref" vue-id="664ecde0-5" labelPosition="left" model="{{form}}" rules="{{rules}}" data-ref="form" bind:__l="__l" vue-slots="{{['default']}}"><view class="box-card"><view class="box-card-title">添加观众</view><view class="box-card-content"><u-form-item class="vue-ref" vue-id="{{('664ecde0-6')+','+('664ecde0-5')}}" label="参观人数" labelWidth="120" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['right']}}"><u-number-box class="plus" vue-id="{{('664ecde0-7')+','+('664ecde0-6')}}" slot="right" inputWidth="44" color="#EF9525" bgColor="#FCF6E3" min="{{1}}" max="{{100}}" bind:__l="__l"></u-number-box></u-form-item><view class="box-tips"><text class="box-tips-txt">每单限购5张，同一身份证当天限购1张</text></view><view class="box-visitor"><block wx:for="{{listVistor}}" wx:for-item="item" wx:for-index="index" wx:key="index"><block><view class="box-visitor-item"><view class="box-visitor-item-left"><u-icon vue-id="{{('664ecde0-8-'+index)+','+('664ecde0-5')}}" name="minus-circle" size="22" color="#828282" bind:__l="__l"></u-icon><view class="box-visitor-info"><view>li王小华u</view><view>320505200102050349</view></view></view><view class="box-visitor-item-right"><u-icon vue-id="{{('664ecde0-9-'+index)+','+('664ecde0-5')}}" name="edit-pen" size="24" color="#828282" bind:__l="__l"></u-icon></view></view></block></block></view><view class="box-footer"><view class="box-footer-left"><view data-event-opts="{{[['tap',[['openAdd',['$event']]]]]}}" class="box-button" bindtap="__e"><u-icon vue-id="{{('664ecde0-10')+','+('664ecde0-5')}}" name="plus" color="#EF9525" bind:__l="__l"></u-icon><text class="box-button-txt">添加观众</text></view></view></view></view></view><view class="box-card"><view class="box-card-title">联系人信息</view><view class="box-card-content"><u-form-item class="vue-ref" vue-id="{{('664ecde0-11')+','+('664ecde0-5')}}" label="联系人" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u-input vue-id="{{('664ecde0-12')+','+('664ecde0-11')}}" placeholder="请输入联系人" bind:__l="__l"></u-input></u-form-item><u-form-item class="vue-ref" vue-id="{{('664ecde0-13')+','+('664ecde0-5')}}" label="手机号" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u-input vue-id="{{('664ecde0-14')+','+('664ecde0-13')}}" placeholder="请输入手机号" bind:__l="__l"></u-input></u-form-item></view></view></u--form><view class="page-bottom"><u-button vue-id="664ecde0-15" type="primary" bind:__l="__l" vue-slots="{{['default']}}">确定</u-button></view></view><u-popup vue-id="664ecde0-16" show="{{showAdd}}" mode="bottom" round="{{10}}" closeable="{{true}}" data-event-opts="{{[['^close',[['closeAdd']]],['^open',[['openAdd']]]]}}" bind:close="__e" bind:open="__e" bind:__l="__l" vue-slots="{{['default']}}"><view class="mpopup"><view class="mpopup-title">添加观众</view><view class="mpopup-content" style="margin-top:60rpx;"><u--form class="vue-ref" vue-id="{{('664ecde0-17')+','+('664ecde0-16')}}" labelPosition="left" model="{{form}}" rules="{{rules}}" data-ref="form" bind:__l="__l" vue-slots="{{['default']}}"><u-form-item class="vue-ref" vue-id="{{('664ecde0-18')+','+('664ecde0-17')}}" label="姓名" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u-input vue-id="{{('664ecde0-19')+','+('664ecde0-18')}}" placeholder="请输入姓名" bind:__l="__l"></u-input></u-form-item><u-form-item class="vue-ref" vue-id="{{('664ecde0-20')+','+('664ecde0-17')}}" label="证件类型" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u--input vue-id="{{('664ecde0-21')+','+('664ecde0-20')}}" placeholder="选择证件类型" suffixIcon="arrow-down-fill" suffixIconStyle="color: #A7A7A7;font-size:24rpx" bind:__l="__l"></u--input></u-form-item><u-form-item class="vue-ref" vue-id="{{('664ecde0-22')+','+('664ecde0-17')}}" label="证件号码" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u-input vue-id="{{('664ecde0-23')+','+('664ecde0-22')}}" placeholder="请输入证件号码" bind:__l="__l"></u-input></u-form-item><u-form-item class="vue-ref" vue-id="{{('664ecde0-24')+','+('664ecde0-17')}}" label="手机号" labelWidth="80" prop="from.number" data-ref="number" bind:__l="__l" vue-slots="{{['default']}}"><u-input vue-id="{{('664ecde0-25')+','+('664ecde0-24')}}" placeholder="请输入手机号" bind:__l="__l"></u-input></u-form-item></u--form><u-button vue-id="{{('664ecde0-26')+','+('664ecde0-16')}}" type="primary" bind:__l="__l" vue-slots="{{['default']}}">确定</u-button></view></view></u-popup></view>