<?php
use \common\libs\MyLib;
?>
<?php $this->beginBlock('header_css'); ?>
<link href="/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<style>
    label.control-label {
        width: 70px;
    }

    .form-inline .form-control {
        width: 180px;
    }
</style>
<?php $this->endBlock(); ?>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="ibox float-e-margins">
        <div class="ibox-title fixed">
            <h5>车辆信息</h5>
            <div class="ibox-tools">
                <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);" onclick="nextInfo()">
                    <i class="fa fa-backward"></i> 下一个
                </a>
                <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);"
                   onclick="goBack()">
                    <i class="fa fa-backward"></i> 返回
                </a>
            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-12">
                    <form role="form" class="form-inline" id="carFrm">
                        <input type="hidden" name="id" value="" class="form-control">
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">车牌号</label>
                            <span class="car-info" data-name="car_no"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">厂牌型号</label>
                            <span class="car-info" data-name="factory_model"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">品牌</label>
                            <span class="car-info" data-name="brand_txt"></span>
                            </select>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">车系</label>
                            <span class="car-info" data-name="series_txt"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">发动机号</label>
                            <span class="car-info" data-name="engine_no"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">车架号</label>
                            <span class="car-info" data-name="car_frame_no"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">初登日期</label>
                            <span class="car-info" data-name="register_date"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">排量</label>
                            <span class="car-info" data-name="displacement_txt"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">车辆类型</label>
                            <span class="car-info" data-name="car_type_txt"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">运营性质</label>
                            <span class="car-info" data-name="car_use_txt"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">座位数</label>
                            <span class="car-info" data-name="seats"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">年份</label>
                            <span class="car-info" data-name="car_year"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">车主</label>
                            <span class="car-info" data-name="car_man"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">联系电话</label>
                            <span class="car-info" data-name="phone"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">证件号码</label>
                            <span class="car-info" data-name="car_man_number"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">商业止保日期</label>
                            <span class="car-info" data-name="insurer1_date"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">交强止保日期</label>
                            <span class="car-info" data-name="insurer2_date"></span>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">保险公司</label>
                            <span class="car-info" data-name="company"></span>
                        </div>
                        <div class="form-group col-sm-12" style="margin-bottom: 8px;">
                            <label class="control-label">备注</label>
                            <span class="car-info" data-name="remark"></span>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="ibox float-e-margins">
        <div class="ibox-title fixed">
            <h5>预约信息</h5>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>车牌号：</dt>
                        <dd class="car-info" data-name="car_no"></dd>
                        <dt>厂牌型号：</dt>
                        <dd class="car-info" data-name="factory_model"></dd>
                        <dt>品牌：</dt>
                        <dd class="car-info" data-name="brand_txt"></dd>
                    </dl>
                </div>
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>发动机号：</dt>
                        <dd class="car-info" data-name="engine_no"></dd>
                        <dt>车架号：</dt>
                        <dd class="car-info" data-name="car_frame_no"></dd>
                        <dt>初登日期：</dt>
                        <dd class="car-info" data-name="register_date"></dd>
                    </dl>
                </div>
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>车辆类型：</dt>
                        <dd class="car-info" data-name="car_type_txt"></dd>
                        <dt>运营性质：</dt>
                        <dd class="car-info" data-name="car_use_txt"></dd>
                        <dt>座位数：</dt>
                        <dd class="car-info" data-name="seats"></dd>
                    </dl>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>车系：</dt>
                        <dd class="car-info" data-name="series_txt"></dd>
                        <dt>排量：</dt>
                        <dd class="car-info" data-name="displacement_txt"></dd>
                        <dt>年份：</dt>
                        <dd class="car-info" data-name="car_year"></dd>
                    </dl>
                </div>
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>新保座席：</dt>
                        <dd class="car-info" data-name="op_user1"></dd>
                        <dt>客服代表：</dt>
                        <dd class="car-info" data-name="op_user2"></dd>
                        <dt>续保座席：</dt>
                        <dd class="car-info" data-name="op_user3"></dd>
                    </dl>
                </div>
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>区域：</dt>
                        <dd class="car-info" data-name="location_txt"></dd>
                        <dt>备注：</dt>
                        <dd class="car-info" data-name="remark">
                        </dd>
                    </dl>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4">
                    <dl class="dl-horizontal">
                        <dt>车主：</dt>
                        <dd class="car-info" data-name="car_man"></dd>
                        <dt>车主证件号码：</dt>
                        <dd class="car-info" data-name="car_man_number"></dd>
                        <dt>联系电话：</dt>
                        <dd>
                            <span class="car-info m-l" data-name="phone"></span>
                        </dd>
                    </dl>
                </div>
                <div class="col-sm-4">
                    <form id="insurerFm">
                        <input type="hidden" name="car_id" class="car_id" value=""/>
                        <dl class="dl-horizontal">
                            <dt>商业止保日期：</dt>
                            <dd><input type="text" class="input-date form-control" name="insurer1_date"
                                       autocomplete="off"
                                       value=""/></dd>
                            <dt>交强止保日期：</dt>
                            <dd><input type="text" class="input-date form-control" name="insurer2_date"
                                       autocomplete="off"
                                       value=""/></dd>
                            <dt>保险公司：</dt>
                            <dd><input type="text" name="company" value="" class="form-control"></dd>
                        </dl>
                    </form>
                </div>
                <div class="col-sm-4">
                    <input type="hidden" name="id" class="form-control" value=""/>
                    <dl class="dl-horizontal">
                        <div class="car-info btn btn-default disabled" data-name="phone"></div>
                        <button type="button" class="btn btn-primary" onclick="strCall()">拨号</button>
                        <button type="button" class="btn btn-danger" onclick="strHook()">挂断</button>
                        <br>
                        <button type="button" class="btn btn-primary m-t" onclick="saveInsurerInfo()">保存</button>
                    </dl>
                </div>
            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-12">
                    <form role="form" class="form-inline clearfix" id="appointmentFrm">
                        <input type="hidden" name="car_id" class="car_id" value=""/>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">预约日期</label>
                            <input type="text" class="input-date form-control" id="pdate" name="pdate" autocomplete="off"
                                   value=""/>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">预约时间</label>
                            <select name="ptime" class="form-control">
                                <option>08:00</option>
                                <option>08:30</option>
                                <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>12:00</option>
                                <option>13:00</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>
                            </select>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">预约类型</label>
                            <select name="ptype" id="appointment_type_info" class="form-control">
                            </select>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">当天预约人数</label>
                            <input type="text" id="day_count" value="0" disabled class="form-control">
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">业务分组</label>
                            <select name="business_group_id" id="business_group_info" class="form-control"></select>
                        </div>
                        <div class="form-group col-sm-3" style="margin-bottom: 8px;">
                            <label class="control-label">预约备注</label>
                            <textarea class="form-control" name="remark"></textarea>
                        </div>
                        <div class="form-group col-sm-3" id="appointment_btn" style="margin-bottom: 8px;">
                            <button type="button" class="btn btn-primary" onclick="appointmentSave()">预约保存</button>
                            <button type="button" class="btn btn-primary" onclick="nextInfo()">下一个</button>
                            <button type="button" class="btn btn-primary" onclick="goBack()">返回</button>
                        </div>
                        <hr>
                        <div class="form-group col-sm-13" style="margin-bottom: 8px;">
                            <label class="control-label">无效数据</label>
                            <select name="invalid_id" id="invalid_info" class="form-control">
                            </select>
                        </div>
                        <div class="form-group col-sm-13" style="margin-bottom: 8px;">
                            <button type="button" class="btn btn-primary m-l" onclick="appointmentInvalid()">无效数据</button>
                        </div>
                    </form>
                    <hr>
                    <table id="appointment_table">
                        <thead>
                        <tr>
                            <th data-field="id">ID</th>
                            <th data-field="pdate">预约日期</th>
                            <th data-field="ptime">预约时间</th>
                            <th data-field="ptype">预约类型</th>
                            <th data-field="remark">预约备注</th>
                            <th data-field="show_name">业务员</th>
                            <th data-field="business_group_txt">业务分组</th>
                            <th data-field="updated_at">操作时间</th>
                        </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="ibox float-e-margins">
        <div class="ibox-title fixed">
            <h5>保单信息</h5>
            <div class="ibox-tools">
                <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);"
                   onclick="goBack()">
                    <i class="fa fa-backward"></i> 返回
                </a>
            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-12">
                    <table id="insurer_order_table">
                        <thead>
                        <tr>
                            <th data-field="id">ID</th>
                            <th data-field="id_man">被保险人</th>
                            <th data-field="insurer1_begin_date">商业起保日期</th>
                            <th data-field="insurer2_begin_date">交强起保日期</th>
                            <th data-field="print_date">出单日期</th>
                            <th data-field="total_all">共计签单</th>
                            <th data-field="show_name">业务员</th>
                            <th data-field="status_txt">状态</th>
                            <th data-formatter="opFormatter">操作</th>
                        </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="ibox float-e-margins">
        <div class="ibox-title fixed">
            <h5>礼品列表</h5>
            <div class="ibox-tools">
                <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);"
                   onclick="goBack()">
                    <i class="fa fa-backward"></i> 返回
                </a>
            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-12">
                    <table id="new_gift_table">
                        <thead>
                        <tr>
                            <th data-field="code">礼品编号</th>
                            <th data-field="type_txt">礼品名称</th>
                            <th data-field="use_date">操作时间</th>
                            <th data-field="show_name">操作员</th>
                            <th data-field="status_txt">状态</th>
                        </tr>
                        </thead>
                    </table>
                </div>
                <hr>
                <div class="col-sm-12">
                    <table id="old_gift_table">
                        <thead>
                        <tr>
                            <th data-field="id">ID</th>
                            <th data-field="name">礼品名称</th>
                            <th data-field="type_txt">类型</th>
                            <th data-field="remark">描述</th>
                            <th data-field="strategy_txt">分类</th>
                            <th data-field="show_name">添加者</th>
                            <th data-field="submit_time_txt">操作时间</th>
                            <th data-field="status_txt">状态</th>
                        </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="ibox float-e-margins">
        <div class="ibox-title fixed">
            <h5>操作记录</h5>
            <div class="ibox-tools">
                <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);"
                   onclick="goBack()">
                    <i class="fa fa-backward"></i> 返回
                </a>
            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-12">
                    <table id="car_history_table">
                        <thead>
                        <tr>
                            <th data-field="id">ID</th>
                            <th data-field="op_man">操作者</th>
                            <th data-field="op_time_txt">操作时间</th>
                            <th data-field="remark">操作内容</th>
                            </th>
                        </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<?php $this->beginBlock('footer_js'); ?>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" language="javascript">
    var params = {};
    $(function () {
        $('.input-date').datepicker({
            keyboardNavigation: false,
            forceParse: false,
            autoclose: true
        });

        // 获取数据,初始化
        $.get('info-track-json' + window.location.search, function (obj) {
            if (obj.code == 200) {
                params = obj.data;
                init();
            } else {
                alert('数据加载错误');
                window.history.go(-1);
            }
        }, 'json');

        $('#pdate').blur(function () {
            var params = $("#appointmentFrm").serialize();
            $.post('/appointment/count', params, function (obj) {
                if (obj.success) {
                    $('#day_count').val(obj.count);
                }
            }, 'json');
        });
        $('#brand_info').change(function () {
            var brand_id = $(this).val();
            $('#series_info').html('<option value="0">---请选择---</option>');
            $('#displacement_info').html('<option value="0">---请选择---</option>');
            if (brand_id > 0) {
                $.get('/car/series-fix', {brand_id: brand_id}, function (obj) {
                    if (obj.success) {
                        $('#series_info').html(obj.html);
                    }
                }, 'json');
            }
        });
        $('#series_info').change(function () {
            var series_id = $(this).val();
            $('#displacement_info').html('<option value="0">---请选择---</option>');
            if (series_id > 0) {
                $.get('/car/displacements-fix', {series_id: series_id}, function (obj) {
                    if (obj.success) {
                        $('#displacement_info').html(obj.html);
                    }
                }, 'json');
            }
        });
    });

    function init(){
        carInfoInit(params['car_info']);
        selectInfoInit(params);
        tableInfoInit(params);
        buttonInit(params['can_cancel']);
    }

    //拨号
    function strCall(phone) {
        parent.drtCall(phone);
    }
    //挂断
    function strHook() {
        parent.drtHook();
    }
    // 保存车辆信息
    function saveCarInfo() {
        var params = $('#carFrm').serialize();
        $.post('/car/save',params,function(obj){
            alert(obj.msg);
            window.location.reload();
        },'json');
    }

    // 下一条信息
    function nextInfo(){
        var param = 'index=' + params['next_index'] + '&type='+ params['type'];
        $.get('/track/ajax-next', param, function (obj) {
            if (obj.success) {
                if (obj.car_id > 0) {
                    window.location.href = '/car/info-track?id=' + obj.car_id + '&type='+ params['type'] +'&next_index='+ params['next_index'] + '&back_params=' + encodeURIComponent(params['back_params']);
                } else {
                    alert('没有记录');
                }
            }
        }, 'json');
    }
    // 返回
    function goBack(){
        var url = '';
        switch (+type) {
            case 1:
                url = '/track/first?' + params['next_index'];break;
            case 2:
                url = '/track/today?' + params['next_index'];break;
            case 3:
                url = '/track/all?' + params['next_index'];break;
        }
        return window.location.href = url;
    }
    // 保险信息保存
    function saveInsurerInfo(){
        var params = $('#insurerFm').serialize();
        $.post('/car/baocun', params, function (obj) {
            alert(obj.msg);
        }, 'json');
    }
    // 取消预约
    function cancelAppointment(){
        //这里是后来需求改了，暂时注释
        //if(location == 6){
        //    var url = '/track/car-cancel-e';
        //}else if(location == 3 || ptype == 3){
        //    var url = '/track/car-cancel';
        //}

        var location = params['car_info']['location'];
        var ptype = $('#appointment_list').children("table").children("tbody").children("tr").eq(1).children(".ptyp").attr('data');

        if (location == 3) {
            //C库数据
            //放d
            var url = '/track/car-cancel';
        } else if (location == 6 && ptype == 5) {
            var url = '/track/car-cancel-e';
        } else {
            //无效
            alert('不是目标客户，请点击无效数据按钮！');
            return false;
        }
        if (confirm('是否确认放弃?')) {
            $.post(url, {id:params['car_info']['id']}, function (obj) {
                alert(obj.msg);
                if (obj.success) {
                    $('.back-btn').click();
                }
            }, 'json');
        }
    }
    // 预约保存
    function appointmentSave(){
        if (confirm('是否确认提交?')) {
            var params = $("#appointmentFrm").serialize();
            $.post('/appointment/save', params, function (obj) {
                alert(obj.msg);
                if (obj.success) {
                    $('#appointmentFrm')[0].reset();
                    $('#appointment_table').bootstrapTable('refresh');
                }
            }, 'json');
        }
    }
    // 无效保存
    function appointmentInvalid(){
        var car_id = params['car_info']['id'];
        var invalid_id = $('#invalid_id').val();
        if (invalid_id == 0) {
            alert('必须选择无效理由!');
            return;
        }
        if (confirm('是否无效这条数据?')) {
            $.post('/car/invalid', {car_id: car_id, invalid_id: invalid_id}, function (obj) {
                alert(obj.msg);
                if (obj.success) {
                    $('#appointment-save-btn').attr('disabled', true);
                    $('.save-btn').attr('disabled', true);
                    $('.invalid-btn').attr('disabled', true);
                }
            }, 'json');
        }
    }

    function tableInfoInit(data){
        var tables = {
            'appointment': '/appointment/index-json',
            'insurer_order': '/car/info-track-table-json',
            'new_gift': '/car/info-track-table-json',
            'old_gift': '/car/info-track-table-json',
            'car_history': '/car/info-track-table-json',
        };
        $.each(tables,function(name,url){
            var $table = $('#'+ name +'_table');
            $table.bootstrapTable('destroy');
            $table.bootstrapTable({
                url: url,
                pagination: true,
                sidePagination: 'server',
                queryParams: function (param) {
                    if(name == 'new_gift'){
                        param['car_no'] = params['car_info']['car_no'];
                    }else {
                        param['car_id'] = params['car_info']['id'];
                    }
                    param['name'] = name;
                    param['limit'] = param['limit'];
                    param['offset'] = param['offset'];
                    return param;
                },
                responseHandler: function (res) {
                    console.log(res);
                    return res
                }
            });
        });
    }

    // 品牌选项初始化
    function selectInfoInit(data){
        var keys = [
            'brand',
            'series',
            'displacement',
            'car_type',
            'car_use',
            'appointment_type',
            'business_group',
            'invalid',
        ];
        $.each(keys,function(index,key){
            var html = '<option value="0">---请选择---</option>';
            $.each(data[key + '_info'],function(i,item){
                var val = item['code']?item['code']:item['id'];
                var selected = data['car_info'][key + '_id'] && data['car_info'][key + '_id'] == val? 'selected': '';
                html += '<option value="'+ val +'" '+ selected +'>'+ item.name +'</option>'
            });
            $('#'+ key + '_info').html(html);
        });
    }

    // 页面车辆数据初始化
    function carInfoInit(data){
        // 页面车辆数据初始化
        $('#carFrm').find('.form-control').each(function(key,item){
            $(item).val(data[$(item).attr('name')]);
        });
        $('.car-info:not(input)').each(function(key,item) {
            $(item).html(data[$(item).data('name')]);
        });
        $('.car_id').val(data['id']);
    }

    function buttonInit(param) {
        if(param){
            $('#appointment_btn').prepend('<button type="button" class="btn btn-primary" onclick="cancelAppointment()">放弃</button>');
        }
    }
</script>
<?php $this->endBlock('footer_js'); ?>