<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=360, user-scalable=0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <title></title>
    <link rel="stylesheet" type="text/css" href="{{ theme }}/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="{{ theme }}/css/bookingSeeHouse.css">
    <script src="{{ theme }}/js/jquery.min.js"></script>
    <script src="{{ theme }}/js/jquery.validate.js"></script>
    <script src="{{ theme }}/js/date-selector.js"></script>
    <script src="{{ theme }}/js/public.js"></script>
    <script>
        $(document).ready(function () {
            var ds = new DateSelector('year', 'month', 'day', {
                MaxYear: new Date().getFullYear() + 1
            });

            var inputDate = $('#date');
            var viewForm = $('#viewForm');
            viewForm.submit(function () {
                var dayValue = Number($('input[name=day]:checked').val());
                var date = new Date();
                switch (dayValue) {
                    case 3:
                        inputDate.val(ds.Year + '-' + ds.Month + '-' + ds.Day);
                        break;
                    default:
                        date.setTime(date.getTime() + dayValue * 24 * 60 * 60 * 1000);
                        inputDate.val(date.Format('yyyy-MM-dd'));
                        break;
                }
                $.ajax({
                    type: 'POST',
                    url: '{{ url }}/wp-admin/admin-ajax.php/',
                    data: 'action=view_house&' + viewForm.serialize(),
                    success: function (data) {
                        if (data.code == 2000) {
                            alert('预约成功');
                        } else {
                            alert('预约失败');
                        }
                    }
                });
                return false;
            });
        });
    </script>
</head>
<body>
<div class="main">
    <form id="viewForm" method="post">
        <p class="">看房时间</p>
        <ul class="list-unstyled">
            <li>
                <label for="jt" class="col-xs-4">
                    <input type="radio" name="day" id="jt" value="0" checked>
                    <span></span>今天
                </label>

                <label for="mt" class="col-xs-4">
                    <input type="radio" name="day" id="mt" value="1">
                    <span></span>明天
                </label>

                <label for="ht" class="col-xs-4 ">
                    <input type="radio" name="day" id="ht" value="2">
                    <span></span>后天
                </label>
            </li>

            <li>
                <label class="col-xs-5">
                    <input type="radio" name="day" value="3">
                    <span></span>指定日期
                </label>

                <p class="col-xs-7">
                    <select id="year" class="form-control">
                        <option value="2015">2015</option>
                        <option value="2016">2016</option>
                    </select>
                    <label for="year">年</label>
                    <select id="month" class="form-control">
                        <option value="8">8</option>
                        <option value="9">9</option>
                    </select>
                    <label for="month">月</label>
                    <select id="day" class="form-control">
                        <option value="8">14</option>
                        <option value="9">15</option>
                    </select>
                    <label for="day">日</label>
                </p>
            </li>

            <li>
                <label for="index" class="col-xs-5">
                    <span class="time"></span>看房时段
                </label>

                <p class="col-xs-7">
                    <select id="index" name="index" class="form-control">
                        <option value="0">9:00-10:00</option>
                        <option value="1">10:00-11:00</option>
                        <option value="2">11:00-12:00</option>
                        <option value="3">12:00-13:00</option>
                        <option value="4">13:00-14:00</option>
                        <option value="5">14:00-15:00</option>
                        <option value="6">15:00-16:00</option>
                        <option value="7">16:00-17:00</option>
                    </select>
                </p>
            </li>
        </ul>
        <input type="hidden" name="date" id="date" value="">
        <input type="hidden" name="user_id" value="{{ user_id }}">
        <input type="hidden" name="house_id" value="{{ house_id }}">
        <input type="hidden" name="consultant_id" value="{{ consultant_id }}">
        <input type="submit" id="view_submit" value="提交" class="btn btn-lg">
    </form>
</div>
</body>
</html>