<style type="text/css">
    .container-fluid{
        background: #fff;
        padding-bottom: 50px;
    }
    .form-inline{
        padding-top: 15px;
    }
    .tab-content.showroom{
        margin-top: 20px;
        padding: 10px 0;
        border-top: 1px solid #f4f4f4;
    }
</style>
<div class=" card" style=";padding:.25rem .4rem .4rem">
    <ul class="nav nav-tabs " role="tablist">
        <li class="nav-item">
            <a href="javascript:;" class="nav-link redirect">产品查看数据</a>
        </li>
        <li class="nav-item">
            <a href="#showroom_pane" class="nav-link active" data-toggle="tab">展厅查看数据</a>
        </li>
        <li class="nav-item pull-right header"></li>
    </ul>

    <div class="tab-content" style="">
        <div class="tab-pane active" id="showroom_pane">
            <div class="container-fluid">
                <form class="form-inline showroom-form" action="#">
                    <div class="form-group col-sm-3">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <span class="input-group-text bg-white text-capitalize"><b>时间</b>&nbsp;<i class="feather icon-calendar"></i></span>
                            </div>
                            <input autocomplete="off" type="text" class="form-control datepicker" id="filter-column-name-start" placeholder="时间" name="name[start]" value="">
                            <span class="input-group-addon" style="border-left: 0; border-right: 0;">To</span>
                            <input autocomplete="off" type="text" class="form-control datepicker" id="filter-column-name-end" placeholder="时间" name="name[end]" value="">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group input-group-sm">
                            <div class="input-group-prepend">
                                <span class="input-group-text bg-white text-capitalize"><b>用户名</b></span>
                            </div>
                            <input type="text" class="form-control filter-column-name" placeholder="用户名" name="name" value="">
                        </div>
                    </div>
                    <button class="btn btn-primary btn-sm btn-mini showroom-search" type="button" style="margin-left: 12px">
                        <i class="feather icon-search"></i><span class="d-none d-sm-inline">&nbsp;&nbsp;搜索</span>
                    </button>
                    <button style="margin-left: 6px" type="reset" class="reset btn btn-white btn-sm ">
                        <i class="feather icon-rotate-ccw"></i><span class="d-none d-sm-inline">&nbsp;&nbsp;重置</span>
                    </button>
                </form>
                <div class="tab-content showroom">
                    <div role="tabpanel" class="tab-pane active">
                        @foreach ($showrooms as $showroom)
                            <button type="button" class="btn btn-default btn-showroom" data-id="{{$showroom->id}}" style="margin: 5px 0;">{{$showroom->name}}</button>
                        @endforeach
                    </div>
                </div>


                <div class="col-md-12" style="margin: 0;padding: 0;">
                    <div id="showroom_analyze" style="height: 660px;"></div>
                </div>
            </div>

        </div>

    </div>
</div>
<script>
    document.querySelector('.redirect').onclick =  function() {
        window.location.href = '/admin/dashboard/view?product=1'
    }
</script>
