@extends('base.base')
@section('base')

<div class="content-wrapper">
 <!--demo1仪表盘-->
 <div class="page-header">
   <h3 class="page-title">
    <span class="page-title-icon bg-gradient-primary text-white mr-2">
      <i class="mdi mdi-home"></i>                 
    </span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
    {{ __('auto.仪表板') }}
    </font></font></h3>
    <nav aria-label="{{ __('auto.面包屑') }}">
      <ul class="breadcrumb">
        <li class="breadcrumb-item active" aria-current="page">
          <span></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.总览') }}
          </font></font><i class="mdi mdi-alert-circle-outline icon-sm text-primary align-middle"></i>
        </li>
      </ul>
    </nav>
  </div>
  <div class="row">
      <div class="col-md-4 stretch-card grid-margin">
        <div class="card bg-gradient-danger card-img-holder text-white">
          <div class="card-body">
            <img src="/assets/images/circle.svg" class="card-img-absolute" alt="{{ __('auto.圆像') }}">
            <h4 class="font-weight-normal mb-3"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.每周销售') }}
              </font></font><i class="mdi mdi-chart-line mdi-24px float-right"></i>
            </h4>
            <h2 class="mb-5"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">$ 15,0000</font></font></h2>
            <h6 class="card-text"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.增加了') }}60％</font></font></h6>
          </div>
        </div>
      </div>
      <div class="col-md-4 stretch-card grid-margin">
        <div class="card bg-gradient-info card-img-holder text-white">
          <div class="card-body">
            <img src="/assets/images/circle.svg" class="card-img-absolute" alt="{{ __('auto.圆像') }}">                  
            <h4 class="font-weight-normal mb-3"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.每周订单') }}
              </font></font><i class="mdi mdi-bookmark-outline mdi-24px float-right"></i>
            </h4>
            <h2 class="mb-5"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">45,6334</font></font></h2>
            <h6 class="card-text"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.减少') }}10％</font></font></h6>
          </div>
        </div>
      </div>
      <div class="col-md-4 stretch-card grid-margin">
        <div class="card bg-gradient-success card-img-holder text-white">
          <div class="card-body">
            <img src="/assets/images/circle.svg" class="card-img-absolute" alt="{{ __('auto.圆像') }}">                                    
            <h4 class="font-weight-normal mb-3"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.访客在线') }}
              </font></font><i class="mdi mdi-diamond mdi-24px float-right"></i>
            </h4>
            <h2 class="mb-5"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">95,5741</font></font></h2>
            <h6 class="card-text"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.增加了') }}5％</font></font></h6>
          </div>
        </div>
      </div>
  </div>
  <div class="row">
    <div class="col-md-7 grid-margin stretch-card">
      <div class="card">
        <div class="card-body"><div class="chartjs-size-monitor" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;"><div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div></div><div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:200%;height:200%;left:0; top:0"></div></div></div>
          <div class="clearfix">
            <h4 class="card-title float-left"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.访问和销售统计') }}</font></font></h4>
            <div id="visit-sale-chart-legend" class="rounded-legend legend-horizontal legend-top-right float-right"><ul><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(218, 140, 255, 1), rgba(154, 85, 255, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.中国') }}</font></font></li><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(255, 191, 150, 1), rgba(254, 112, 150, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.美国') }}</font></font></li><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(54, 215, 232, 1), rgba(177, 148, 250, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.英国') }}</font></font></li></ul></div>                                     
          </div>
          <canvas id="visit-sale-chart" class="mt-4 chartjs-render-monitor" width="363" height="181" style="display: block; width: 363px; height: 181px;"></canvas>
        </div>
      </div>
    </div>
    <div class="col-md-5 grid-margin stretch-card">
      <div class="card">
        <div class="card-body"><div class="chartjs-size-monitor" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;"><div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div></div><div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:200%;height:200%;left:0; top:0"></div></div></div>
          <h4 class="card-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.流量来源') }}</font></font></h4>
          <canvas id="traffic-chart" width="225" height="112" class="chartjs-render-monitor" style="display: block; width: 225px; height: 112px;"></canvas>
          <div id="traffic-chart-legend" class="rounded-legend legend-vertical legend-bottom-left pt-4"><ul><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(54, 215, 232, 1), rgba(177, 148, 250, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.搜索引擎') }}</font></font><span class="float-right"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">30％</font></font></span></li><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(6, 185, 157, 1), rgba(132, 217, 210, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.直接点击') }}</font></font><span class="float-right"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">30％</font></font></span></li><li><span class="legend-dots" style="background:linear-gradient(to right, rgba(255, 191, 150, 1), rgba(254, 112, 150, 1))"></span><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.书签点击') }}</font></font><span class="float-right"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">40％</font></font></span></li></ul></div>                                                      
        </div>
      </div>
    </div>
  </div>
  <!--end-->

  <!--demo2基本表-->
  <div class="page-header">
    <h3 class="page-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
      {{ __('auto.基本表') }}
    </font></font></h3>
    <nav aria-label="{{ __('auto.面包屑') }}">
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="#"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.桌子') }}</font></font></a></li>
        <li class="breadcrumb-item active" aria-current="page"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.基本表') }}</font></font></li>
      </ol>
    </nav>
  </div>
  <div class="row">
    <div class="col-lg-12 grid-margin stretch-card">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">{{ __('auto.数据统计') }}</h4>
                <form class="well form-inline margin-top-20" method="get" action="/admin/card/statistics">
                    <spen style="padding-left: 10px">{{ __('auto.选择时间：') }}</spen>
                    <input type="date" step="01" id="start_time" name="start_time" class="form-control" value="2019-12-12">&nbsp;&nbsp;
                    <input type="date" step="01" id="end_time" name="end_time" class="form-control" value="2019-12-12">&nbsp;&nbsp;

                    <input type="text" name="wd" class="form-control" placeholder="{{ __('auto.请输入关键字') }}" value="">&nbsp;&nbsp;
                    <select class="form-control" name="kind_id" value="">
                        <option value="">{{ __('auto.选择游戏') }}</option>
                            <option value="1010">{{ __('auto.百人大吃小') }}</option>
                            <option value="1009">{{ __('auto.百人捞腌菜') }}</option>
                    </select>&nbsp;&nbsp;
                    <input type="submit" class="btn btn-light btn-fw" value="{{ __('auto.搜索') }}">&nbsp;&nbsp;
                    <a href="/admin/card/statistics" class="btn btn-light btn-fw">{{ __('auto.清空') }}</a>&nbsp;&nbsp;
                    <a href="/admin/card/statistics?excel=1&amp;start_time=2019-12-12&amp;end_time=2019-12-12" class="btn btn-light btn-fw">{{ __('auto.导出') }}</a>
                </form>
                <table class="table table-hover">
        <thead>
          <tr>
            <th><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.用户') }}</font></font></th>
            <th><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.产品') }}</font></font></th>
            <th><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.特卖') }}</font></font></th>
            <th><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.状态') }}</font></font></th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.雅各布') }}</font></font></td>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.的') }}Photoshop</font></font></td>
            <td class="text-danger"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 28.76％ </font></font><i class="mdi mdi-arrow-down"></i></td>
            <td><label class="badge badge-danger"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.待定') }}</font></font></label></td>
          </tr>
          <tr>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.凌乱的') }}</font></font></td>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.闪') }}</font></font></td>
            <td class="text-danger"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 21.06％ </font></font><i class="mdi mdi-arrow-down"></i></td>
            <td><label class="badge badge-warning"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.进行中') }}</font></font></label></td>
          </tr>
          <tr>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.约翰') }}</font></font></td>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.总理') }}</font></font></td>
            <td class="text-danger"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 35.00％ </font></font><i class="mdi mdi-arrow-down"></i></td>
            <td><label class="badge badge-info"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.固定') }}</font></font></label></td>
          </tr>
          <tr>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.彼得') }}</font></font></td>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.后遗症') }}</font></font></td>
            <td class="text-success"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 82.00％ </font></font><i class="mdi mdi-arrow-up"></i></td>
            <td><label class="badge badge-success"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.已完成') }}</font></font></label></td>
          </tr>
          <tr>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.戴夫') }}</font></font></td>
            <td><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">53275535</font></font></td>
            <td class="text-success"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 98.05％ </font></font><i class="mdi mdi-arrow-up"></i></td>
            <td><label class="badge badge-warning"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.进行中') }}</font></font></label></td>
          </tr>
        </tbody>
      </table>
                <div class="box-footer clearfix">
                    {{ __('auto.总共') }} <b>1</b> {{ __('auto.条,分为') }}<b>1</b>{{ __('auto.页') }}
                    
                </div>
            </div>
        </div>
    </div>
  </div>
  <!--end-->

  <!--demo3折线图-->
  <div class="content-wrapper">
            <div class="page-header">
              <h3 class="page-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
                {{ __('auto.图表') }}js
              </font></font></h3>
              <nav aria-label="{{ __('auto.面包屑') }}">
                <ol class="breadcrumb">
                  <li class="breadcrumb-item"><a href="#"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.图表') }}</font></font></a></li>
                  <li class="breadcrumb-item active" aria-current="page"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.图表') }}js</font></font></li>
                </ol>
              </nav>
            </div>
            <div class="row">
              <div class="col-lg-6 grid-margin stretch-card">
                <div class="card">
                  <div class="card-body"><div class="chartjs-size-monitor" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: hidden; pointer-events: none; visibility: hidden; z-index: -1;"><div class="chartjs-size-monitor-expand" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:1000000px;height:1000000px;left:0;top:0"></div></div><div class="chartjs-size-monitor-shrink" style="position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1;"><div style="position:absolute;width:200%;height:200%;left:0; top:0"></div></div></div>
                    <h4 class="card-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.折线图') }}</font></font></h4>
                    <canvas id="lineChart" style="height: 163px; display: block; width: 326px;" width="326" height="163" class="chartjs-render-monitor"></canvas>
                  </div>
                </div>
              </div>
  </div>
  <!--end-->

  <!--demo4输入框选择框-->
  <div class="col-md-6 grid-margin stretch-card">
      <div class="card">
        <div class="card-body">
          <h4 class="card-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.水平形式') }}</font></font></h4>
          <p class="card-description"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
            {{ __('auto.水平表格布局') }}
          </font></font></p>
          <form class="forms-sample">
            <div class="form-group row">
              <label for="exampleInputUsername2" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.电子邮件') }}</font></font></label>
              <div class="col-sm-9">
                <input type="text" class="form-control" id="exampleInputUsername2" placeholder="Username">
              </div>
            </div>
            <div class="form-group row">
              <label for="exampleInputEmail2" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.电子邮件') }}</font></font></label>
              <div class="col-sm-9">
                <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Email">
              </div>
            </div>
            <div class="form-group row">
              <label for="exampleInputMobile" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.移动') }}</font></font></label>
              <div class="col-sm-9">
                <input type="text" class="form-control" id="exampleInputMobile" placeholder="Mobile number">
              </div>
            </div>
            <div class="form-group row">
              <label for="exampleInputPassword2" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.密码') }}</font></font></label>
              <div class="col-sm-9">
                <input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">
              </div>
            </div>
            <div class="form-group row">
              <label for="exampleInputConfirmPassword2" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.选择') }}</font></font></label>
              <div class="col-sm-9">
              <select class="form-control form-control-lg" id="exampleFormControlSelect1">
                <option><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">1{{ __('auto.个') }}</font></font></option>
                <option><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">2</font></font></option>
                <option><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">3</font></font></option>
                <option><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">4</font></font></option>
                <option><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">5</font></font></option>
              </select>
              </div>
            </div>

            <div class="form-group row">
              <label for="exampleInputConfirmPassword2" class="col-sm-3 col-form-label"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.重新输入密码') }}</font></font></label>
              <div class="col-sm-9">
                <input type="password" class="form-control" id="exampleInputConfirmPassword2" placeholder="Password">
              </div>
            </div>
            <div class="form-check form-check-flat form-check-primary">
              <label class="form-check-label">
                <input type="checkbox" class="form-check-input"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
                {{ __('auto.记住账号') }}
              </font></font><i class="input-helper"></i></label>
            </div>
            <button type="submit" class="btn btn-gradient-primary mr-2"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.提交') }}</font></font></button>
            <button class="btn btn-light"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.取消') }}</font></font></button>
          </form>
        </div>
      </div>
  </div>
  <!--end-->

  <!--demo5基本按钮-->
  <div class="card-body">
      <h4 class="card-title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.单色按钮') }}</font></font></h4>
      <p class="card-description"><font style="vertical-align: inherit;"></font><code>.btn-{color}</code><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.为主题颜色') }}</font><font style="vertical-align: inherit;">{{ __('auto.添加') }}</font><font style="vertical-align: inherit;">{{ __('auto.按钮') }}</font><font style="vertical-align: inherit;">{{ __('auto.类') }}</font></font></p>
      <div class="template-demo">
        <button type="button" class="btn btn-primary btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.主') }}</font></font></button>
        <button type="button" class="btn btn-secondary btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.次要的') }}</font></font></button>
        <button type="button" class="btn btn-success btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.成功') }}</font></font></button>
        <button type="button" class="btn btn-danger btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.危险') }}</font></font></button>
        <button type="button" class="btn btn-warning btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.警告') }}</font></font></button>
        <button type="button" class="btn btn-info btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.信息') }}</font></font></button>
        <button type="button" class="btn btn-light btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.光') }}</font></font></button>
        <button type="button" class="btn btn-dark btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.暗') }}</font></font></button>
        <button type="button" class="btn btn-link btn-fw"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">{{ __('auto.链接') }}</font></font></button>
      </div>
  </div>
  <!--end-->
</div>

@endsection