<?php
use common\libs\MyLinkPager;

$this->title = $car_info->car_no.'的预约信息';
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><?=$this->title?></title>
    <link href="/js/lib/datepicker/css/bootstrap.css" rel="stylesheet">
    <link href="/js/lib/datepicker/css/bootstrap-datepicker.css" rel="stylesheet">
    <link href="/css/base.css" rel="stylesheet">
    <link href="/css/pages/list.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <div id="inner-hd">
        <div class="crumbs">
            <i class="crumbs-arrow"></i>
            <a href="javascript:;" class="crumbs-label"><?=$this->title?></a>
        </div>
    </div>

    <div id="inner-bd">
        <div class="tab-wraper">
            <ul class="tab">
                <li name="appointment" class="current"><a href="javascript:;">添加预约</a></li>
                <li name="list"><a href="javascript:;">预约历史</a></li>
            </ul>
        </div>
        <div class="appointment">
            <div class="button-group">
                <div class="button current save-btn">
                    <i class="iconfont">&#xe76a;</i>
                    <span class="button-label">保存</span>
                </div>
                <div class="button back-btn">
                    <i class="iconfont">&#xe600;</i>
                    <span class="button-label">返回</span>
                </div>
            </div>
            <form id="theFrm" method="post" action="/sales-mng/sales-appointment-save">
                <input type="hidden" name="car_id" value="<?=$car_info->id?>">
                <input name="_csrf" type="hidden" id="_csrf" value="<?=Yii::$app->request->csrfToken ?>">
                <table class="kv-table">
                    <tbody>
                    <tr>
                        <td class="kv-label">初登日期</td>
                        <td class="kv-content">
                            <div class="date">
                                <input style="width:80%;" type="text" id="pdate" name="pdate" value="<?=date('Y-m-d')?>">
                                <i class="iconfont">&#xe784;</i>
                            </div>
                        </td>
                        <td class="kv-label">预约时间</td>
                        <td class="kv-content">
                            <select name="ptime" id="ptime">
                                <option>09:00</option>
                                <option>09:30</option>
                                <option>10:00</option>
                                <option>10:30</option>
                                <option>11:00</option>
                                <option>11:30</option>
                                <option>13:30</option>
                                <option>14:00</option>
                                <option>14:30</option>
                                <option>15:00</option>
                                <option>15:30</option>
                                <option>16:00</option>
                                <option>16:30</option>
                                <option>17:00</option>
                                <option>17:30</option>
                            </select>
                        </td>
                        <td class="kv-label">预约人数</td>
                        <td class="kv-content">
                            0
                        </td>
                    </tr>
                    <tr>
                        <td class="kv-label">备注</td>
                        <td colspan="5" class="kv-content">
                            <textarea style="width:97%; height: 50px;" name="remark" id="remark"></textarea>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </form>
        </div>
        <div class="list">
            <div class="table-zone">
                <form id="theFrm">
                    <table>
                        <thead>
                        <tr>
                            <td class="w70">ID</td>
                            <td class="w70">预约日期</td>
                            <td class="w70">预约时间</td>
                            <td class="wauto">备注</td>
                            <td class="w70">业务员</td>
                        </tr>
                        </thead>
                        <tbody>
                        <?php
                        foreach($items as $item) {
                            ?>
                            <tr>
                                <td class="text-center"><?=$item->id?></td>
                                <td class="text-left"><?=$item->pdate?></td>
                                <td class="text-left"><?=$item->ptime?></td>
                                <td class="text-left"><?=$item->remark?></td>
                                <td class="text-center"><?=$item->user?$item->user->getShowName():''?></td>
                            </tr>
                            <?php
                        }
                        ?>
                        </tbody>
                    </table>
                </form>
            </div>
            <?php
            echo MyLinkPager::widget([
                'pagination' => $pagination,
            ]);
            ?>
        </div>
    </div>
    <div id="inner-ft">
        <br>
        <br>
    </div>
</div>

<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/global.js"></script>
<script type="text/javascript" src="/js/core.js"></script>
<script type="text/javascript" src="/js/jquery.grid.js"></script>
<script type="text/javascript" src="/js/lib/datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="/js/lib/datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<script type="text/javascript">
    $(function(){
        $('select').select();
        $('.save-btn').click(function(){
            var params = $('#theFrm').serialize();
            var url = $('#theFrm').attr('action');
            $.post(url,params,function(obj){
                if(obj.success) {
                    alert(obj.msg);
                    window.location.href =  '/sales-mng/sales-appointment?car_id=<?=$car_info->id?>';
                } else {
                    alert(obj.msg);
                }
            },'json');
        });
        $('.back-btn').click(function(){
            window.history.go(-1);
        });
        $("#pdate").datepicker({
            "language":"zh-CN",
            "format": 'yyyy-mm-dd'
        });

        $(".date .iconfont").click(function(){
            $(this).prev().trigger("focus");
        });

        $(".tab > li").click(function(){
            $(".tab > li").removeClass("current");
            $(this).addClass("current");
            $(".appointment,.list").hide();
            $("." + $(".tab >li.current").attr("name")).show();
        });
        $('.list').hide();
    });
</script>
</body>
</html>
