
<?php $__env->startSection('title','KM BackOffice'); ?>
<?php $__env->startSection('content'); ?>
<div class="main-content">
    <?php echo $__env->make('layouts/partials/back/header', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
    
    <main>
        <div class="banner">
            <span class="fas <?php echo e($page['data']['icon']); ?>"></span>
            <span><?php echo e($page['data']['name']); ?></span>
        </div>
        <div class="container" id="blade">
            <br>
            <div class="form-group">
                <!----------------- TAB ----------------->
                <ul class="nav navtab-pills" id="pills-tab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="navtab-link active" id="pills-web-tab" data-bs-toggle="pill"
                            data-bs-target="#pills-web" type="button" role="tab" aria-controls="pills-web"
                            aria-selected="true">
                            <i class="fas fa-mouse-pointer"></i> เข้าชมเว็บไซต์
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="navtab-link" id="pills-member-tab" data-bs-toggle="pill"
                            data-bs-target="#pills-member" type="button" role="tab" aria-controls="pills-member"
                            aria-selected="false">
                            <i class="fas fa-users"></i> สมาชิก
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="navtab-link" id="pills-asset-tab" data-bs-toggle="pill"
                            data-bs-target="#pills-asset" type="button" role="tab" aria-controls="pills-asset"
                            aria-selected="false">
                            <i class="fas fa-book"></i> สินทรัพย์ความรู้
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="navtab-link" id="pills-qa-tab" data-bs-toggle="pill" data-bs-target="#pills-qa"
                            type="button" role="tab" aria-controls="pills-qa" aria-selected="false">
                            <i class="fas fa-comment"></i> Knowledge Q&A
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="navtab-link" id="pills-history-tab" data-bs-toggle="pill"
                            data-bs-target="#pills-history" type="button" role="tab" aria-controls="pills-history"
                            aria-selected="false">
                            <i class="far fa-clock"></i> ประวัติการใช้งาน
                        </button>
                    </li>
                </ul>
                <!----------------- Content Tab ----------------->
                <div class="tab-content" id="pills-tabContent">
                    <!----------------- Content Tab เข้าชมเว็บไซต์  ----------------->
                    <div class="tab-pane fade show active" id="pills-web" role="tabpanel"
                        aria-labelledby="pills-web-tab">
                        <div class="borders-green">
                            <div class="container" style="padding-top: 1rem">
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">จำนวนผู้เข้าชมเว็บไซต์ล่าสุด</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="row txtgreen-1">
                                            <div class="col">
                                                <?php if(session()->has('visit')): ?>
                                                <?php
                                                    $number = str_pad(session()->get('visit')[0]['count'], 8, '0', STR_PAD_LEFT);
                                                ?>
                                                <h2><?php echo e($number); ?> ราย</h2>
                                                <?php else: ?>
                                                <h2>00000000 ราย</h2>
                                                <?php endif; ?>                                                
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>

                                <form id="formView" name="formView" class="needs-validation" novalidate>
                                    <div class="row justify-content-md-center">
                                        <div class="col-12">
                                            <div class="kitem-1 ">
                                                <h5 class="txtorange-1">เลือกวันที่ต้องการ</h5></strong>
                                            </div>
                                            <hr class="line1">
                                        </div>
                                    </div>
                                    <div class="row justify-content-md-center">
                                        <div class="col">
                                            <div class="mb-3">
                                                <?php 
                                                    $lang = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2);
                                                ?>

                                                <?php if($lang == 'th'): ?>
                                                <label class="form-label">เริ่ม (วัน/เดือน/ปี ค.ศ.)</label>
                                                <?php elseif($lang == 'en'): ?>
                                                <label class="form-label">เริ่ม (เดือน/วัน/ปี ค.ศ.)</label>
                                                <?php else: ?>
                                                <label class="form-label">เริ่ม</label>
                                                <?php endif; ?>

                                                <input id="view_start" name="view_start" type="date"
                                                    class="form-control" aria-describedby="inputGroupPrepend" required>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="mb-3">
                                                <?php if($lang == 'th'): ?>
                                                <label class="form-label">สิ้นสุด (วัน/เดือน/ปี ค.ศ.)</label>
                                                <?php elseif($lang == 'en'): ?>
                                                <label class="form-label">สิ้นสุด (เดือน/วัน/ปี ค.ศ.)</label>
                                                <?php else: ?>
                                                <label class="form-label">สิ้นสุด</label>
                                                <?php endif; ?>

                                                <input id="view_end" name="view_end" type="date" class="form-control"
                                                    aria-describedby="inputGroupPrepend" required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row justify-content-md-center">
                                        <div class="col">
                                            <div class="mb-3">
                                                <div class="row justify-content-md-center">                                                    
                                                    <div class="d-grid gap-2 col-lg-2 mx-auto">
                                                        <button type="submit" class="btn btn-primary">
                                                            แสดงผล <i class="fas fa-search"></i>
                                                        </button>
                                                    </div>
                                                    <div class="col-lg-10"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>

                                <br>
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">ผลการแสดงข้อมูล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="recent-grid">
                                            <div class="card">
                                                <div class="card-body">
                                                    <!-- highchart -->
                                                    <div class="recent-grid">
                                                        <figure class="highcharts-figure">
                                                            <div id="chart-visit"></div>
                                                            <p class="highcharts-description"></p>
                                                        </figure>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                            </div>
                        </div>
                    </div>

                    <!----------------- Content Tab สมาชิก  ----------------->
                    <div class="tab-pane fade " id="pills-member" role="tabpanel" aria-labelledby="pills-member-tab">
                        <div class="borders-green">
                            <div class="container" style="padding-top: 1rem">
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">เลือกรูปแบบการแสดงผล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="mb-3 row">
                                            <label for="inputPassword"
                                                class="col-sm-2 col-form-label">รูปแบบสมาชิก:</label>
                                            <div class="col-sm-10">
                                                <div class="form-check form-check-inline">
                                                    <input class="form-check-input" type="radio" name="user_format"
                                                        value="age">
                                                    <label class="form-check-label" for="inlineRadio1">ช่วงอายุ</label>
                                                </div>
                                                <div class="form-check form-check-inline">
                                                    <input class="form-check-input" type="radio" name="user_format"
                                                        value="group">
                                                    <label class="form-check-label"
                                                        for="inlineRadio2">กลุ่มผู้ใช้งาน</label>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">ผลการแสดงข้อมูล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="recent-grid">
                                            <div class="card">
                                                <div class="card-body">
                                                    <!-- highchart -->
                                                    <div class="recent-grid">
                                                        <figure class="highcharts-figure">
                                                            <div id="chart-user"></div>
                                                            <p class="highcharts-description">
                                                            </p>
                                                        </figure>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                            </div>
                        </div>
                    </div>

                    <!----------------- Content Tab สินทรัพย์ความรู้  ----------------->
                    <div class="tab-pane fade" id="pills-asset" role="tabpanel" aria-labelledby="pills-asset-tab">
                        <div class="borders-green">
                            <div class="container" style="padding-top: 1rem">
                                <form id="formContent" name="formContent" class="needs-validation" novalidate>
                                    <div class="row justify-content-md-center">
                                        <div class="col-12">
                                            <div class="kitem-1 ">
                                                <h5 class="txtorange-1">เลือกรูปแบบการแสดงผล</h5></strong>
                                            </div>
                                            <hr class="line1">
                                            <div class="mb-3 row">
                                                <label for="inputPassword"
                                                    class="col-sm-2 col-form-label">รูปแบบสินทรัพย์ความรู้:</label>
                                                <div class="col-sm-10">
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_format" value="category">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนผู้เข้าชมแต่ละหมวดหมู่สินทรัพย์ความรู้</label>
                                                    </div>
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_format" value="content">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนผู้เข้าชมแต่ละสินทรัพย์ความรู้</label>
                                                    </div>
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_format" value="infographic">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนการดาวน์โหลดอินโฟกราฟฟิกแต่ละสินทรัพย์ความรู้</label>
                                                    </div>
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_format" value="document">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนการดาวน์โหลดเอกสารแต่ละสินทรัพย์ความรู้</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="mb-3 row">
                                                <label for="inputPassword"
                                                    class="col-sm-2 col-form-label">จำนวนรายการที่แสดงผล:</label>
                                                <div class="col-sm-10">
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="content_view"
                                                            value="all">
                                                        <label class="form-check-label">ทั้งหมด</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="content_view"
                                                            value="5">
                                                        <label class="form-check-label">5</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="content_view"
                                                            value="10">
                                                        <label class="form-check-label">10</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="content_view"
                                                            value="15">
                                                        <label class="form-check-label">15</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="content_view"
                                                            value="20">
                                                        <label class="form-check-label">20</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="mb-3 row">
                                                <label class="col-sm-2 col-form-label">การจัดเรียงข้อมูล:</label>
                                                <div class="col-sm-10">
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_order" value="desc">
                                                        <label class="form-check-label">เรียงจากมากไปน้อย</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio"
                                                            name="content_order" value="asc">
                                                        <label class="form-check-label">เรียงจากน้อยไปมาก</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="mb-3">
                                                <div class="row justify-content-md-center">
                                                    <!-- <div class="col-lg-11"></div> -->
                                                    <div class="d-grid gap-2 col-lg-2 mx-auto">
                                                        <button type="submit" class="btn btn-primary">
                                                            แสดงผล <i class="fas fa-search"></i>
                                                        </button>
                                                    </div>
                                                    <div class="col-lg-10"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br>
                                </form>
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">ผลการแสดงข้อมูล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="recent-grid">
                                            <div class="card">
                                                <div class="card-body">
                                                    <!-- highchart -->
                                                    <div class="recent-grid">
                                                        <figure class="highcharts-figure">
                                                            <div id="chart-content"></div>
                                                            <p class="highcharts-description">
                                                            </p>
                                                        </figure>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                            </div>
                        </div>
                    </div>

                    <!----------------- Content Tab Knowledge Q&A  ----------------->
                    <div class="tab-pane fade" id="pills-qa" role="tabpanel" aria-labelledby="pills-qa-tab">
                        <div class="borders-green">
                            <div class="container" style="padding-top: 1rem">
                            <form id="formClinic" name="formClinic" class="needs-validation" novalidate>
                                    <div class="row justify-content-md-center">
                                        <div class="col-12">
                                            <div class="kitem-1 ">
                                                <h5 class="txtorange-1">เลือกรูปแบบการแสดงผล</h5></strong>
                                            </div>
                                            <hr class="line1">
                                            <div class="mb-3 row">
                                                <label for="inputPassword"
                                                    class="col-sm-3 col-form-label">รูปแบบ Knowledge Q&A:</label>
                                                <div class="col-sm-9">
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="clinic_format" value="category">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนผู้เข้าชมแต่ละห้องความรู้</label>
                                                    </div>
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="radio"
                                                            name="clinic_format" value="clinic">
                                                        <label class="form-check-label"
                                                            for="inlineRadio1">จำนวนผู้เข้าชมแต่ละ Knowledge</label>
                                                    </div>                                                    
                                                </div>
                                            </div>
                                            <div class="mb-3 row">
                                                <label for="inputPassword"
                                                    class="col-sm-3 col-form-label">จำนวนรายการที่แสดงผล:</label>
                                                <div class="col-sm-9">
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="clinic_view"
                                                            value="all">
                                                        <label class="form-check-label">ทั้งหมด</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="clinic_view"
                                                            value="5">
                                                        <label class="form-check-label">5</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="clinic_view"
                                                            value="10">
                                                        <label class="form-check-label">10</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="clinic_view"
                                                            value="15">
                                                        <label class="form-check-label">15</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio" name="clinic_view"
                                                            value="20">
                                                        <label class="form-check-label">20</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="mb-3 row">
                                                <label class="col-sm-3 col-form-label">การจัดเรียงข้อมูล:</label>
                                                <div class="col-sm-9">
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio"
                                                            name="clinic_order" value="desc">
                                                        <label class="form-check-label">เรียงจากมากไปน้อย</label>
                                                    </div>
                                                    <div class="form-check form-check-inline">
                                                        <input class="form-check-input" type="radio"
                                                            name="clinic_order" value="asc">
                                                        <label class="form-check-label">เรียงจากน้อยไปมาก</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="mb-3">
                                                <div class="row justify-content-md-center">
                                                    <!-- <div class="col-lg-11"></div> -->
                                                    <div class="d-grid gap-2 col-lg-2 mx-auto">
                                                        <button type="submit" class="btn btn-primary">
                                                            แสดงผล <i class="fas fa-search"></i>
                                                        </button>
                                                    </div>
                                                    <div class="col-lg-10"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br>
                                </form>
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">ผลการแสดงข้อมูล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="recent-grid">
                                            <div class="card">
                                                <div class="card-body">
                                                    <!-- highchart -->
                                                    <div class="recent-grid">
                                                        <figure class="highcharts-figure">
                                                            <div id="chart-clinic"></div>
                                                            <p class="highcharts-description">
                                                            </p>
                                                        </figure>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                            </div>
                        </div>
                    </div>

                    <!----------------- Content Tab ประวัติการใช้งาน  ----------------->
                    <div class="tab-pane fade" id="pills-history" role="tabpanel" aria-labelledby="pills-history-tab">
                        <div class="borders-green">
                            <div class="container" style="padding-top: 1rem">
                                <form id="formHistory" name="formHistory" class="needs-validation" novalidate>
                                    <div class="row justify-content-md-center">
                                        <div class="col-12">
                                            <div class="kitem-1 ">
                                                <h5 class="txtorange-1">เลือกวันที่ต้องการ</h5></strong>
                                            </div>
                                            <hr class="line1">
                                        </div>
                                    </div>
                                    <div class="row justify-content-md-center">
                                        <div class="col">
                                            <div class="mb-3">
                                                <?php if($lang == 'th'): ?>
                                                <label class="form-label">เริ่ม (วัน/เดือน/ปี ค.ศ.)</label>
                                                <?php elseif($lang == 'en'): ?>
                                                <label class="form-label">เริ่ม (เดือน/วัน/ปี ค.ศ.)</label>
                                                <?php else: ?>
                                                <label class="form-label">เริ่ม</label>
                                                <?php endif; ?>

                                                <input id="history_start" name="history_start" type="date"
                                                    class="form-control" aria-describedby="inputGroupPrepend" required>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="mb-3">
                                                <?php if($lang == 'th'): ?>
                                                <label class="form-label">สิ้นสุด (วัน/เดือน/ปี ค.ศ.)</label>
                                                <?php elseif($lang == 'en'): ?>
                                                <label class="form-label">สิ้นสุด (เดือน/วัน/ปี ค.ศ.)</label>
                                                <?php else: ?>
                                                <label class="form-label">สิ้นสุด</label>
                                                <?php endif; ?>

                                                <input id="history_end" name="history_end" type="date" class="form-control"
                                                    aria-describedby="inputGroupPrepend" required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row justify-content-md-center">
                                        <div class="col">
                                            <div class="mb-3">
                                                <div class="row justify-content-md-center">                                                    
                                                    <div class="d-grid gap-2 col-lg-2 mx-auto">
                                                        <button type="submit" class="btn btn-primary">
                                                            แสดงผล <i class="fas fa-search"></i>
                                                        </button>
                                                    </div>
                                                    <div class="col-lg-10"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>

                                <br>
                                <div class="row justify-content-md-center">
                                    <div class="col-12">
                                        <div class="kitem-1 ">
                                            <h5 class="txtorange-1">ผลการแสดงข้อมูล</h5></strong>
                                        </div>
                                        <hr class="line1">
                                        <div class="recent-grid">
                                            <div class="card">
                                                <div class="card-body">
                                                    <!-- highchart -->
                                                    <div id="table-log">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
</div>

<script>
$('input[type=radio][name=user_format]').change(function() {
    // alert(this.value);
    if (this.value == "age") {
        user_age_barchart(this.value);
    } else if (this.value == "group") {
        user_group_barchart(this.value);
    }
});

function user_age_barchart(format) {
    // console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    $.ajax({
        type: "post",
        url: 'report/reportUser',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-user', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสมาชิก'
                },
                subtitle: {
                    text: 'แสดงจำนวนสมาชิกแต่ละช่วงอายุ'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนสมาชิก (คน)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} คน'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> คน<br/>'
                },
                series: [{
                    name: "ช่วงอายุ",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

function user_group_barchart(format) {
    // console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    $.ajax({
        type: "post",
        url: 'report/reportUser',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-user', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสมาชิก'
                },
                subtitle: {
                    text: 'แสดงจำนวนสมาชิกแต่ละกลุ่มผู้ใช้งาน'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนสมาชิก (คน)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} คน'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f} คน</b><br/>'
                },
                series: [{
                    name: "กลุ่มผู้ใช้งาน",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

var $formContent = $("#formContent");
$formContent.validate({
    rules: {
        content_format: {
            required: true,
        },
        content_view: {
            required: true,
        },
        content_order: {
            required: true,
        }
    },
    messages: {
        content_format: {
            required: "กรุณาเลือกรูปแบบสินทรัพย์ความรู้",
        },
        content_view: {
            required: "กรุณาเลือกจำนวนรายการที่แสดงผล",
        },
        content_order: {
            required: "เลือกการจัดเรียงข้อมูล",
        }
    },
    submitHandler: function() {
        var format = $('input[name="content_format"]:checked').val();
        var limit = $('input[name="content_view"]:checked').val();
        var order = $('input[name="content_order"]:checked').val();

        if (format == "category") {
            con_category_barchart(format, limit, order);
        } else if (format == "content") {
            con_content_barchart(format, limit, order);
        } else if (format == "infographic") {
            con_infographic_barchart(format, limit, order);
        } else if (format == "document") {
            con_document_barchart(format, limit, order);
        }

    },
    errorElement: "div",
    errorPlacement: function(error, element) {
        // Add the `invalid-feedback` class to the error element
        error.addClass("invalid-feedback");

        // Add `has-feedback` class to the parent div.form-group
        // in order to add icons to inputs
        // element.parents(".col-sm-5").addClass("has-feedback");

        if (element.prop("type") === "checkbox") {
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            element = $("#select2-" + elem.attr("id") + "-container").parent();
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        // Add the span element, if doesn't exists, and apply the icon classes to it.
        if (!element.next("span")[0]) {
            $("<span class='glyphicon glyphicon-remove form-control-feedback'></span>")
                .insertAfter(element);
        }
    },
    success: function(label, element) {
        // Add the span element, if doesn't exists, and apply the icon classes to it.
        // console.log(element);
        if (!$(element).next("span")[0]) {
            $("<span class='glyphicon glyphicon-ok form-control-feedback'></span>")
                .insertAfter(
                    $(element));
        }
    },
    highlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-error").removeClass("has-success");
        // $(element).next("span").addClass("glyphicon-remove").removeClass("glyphicon-ok");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().addClass(
                errorClass);
        } else {
            elem.addClass(errorClass);
        }
    },
    unhighlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-success").removeClass("has-error");
        // $(element).next("span").addClass("glyphicon-ok").removeClass("glyphicon-remove");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().removeClass(
                errorClass);
        } else {
            elem.removeClass(errorClass);
        }
    }
});

function con_category_barchart(format, limit, order) {
    console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);
    form_data.append('file', 0);

    $.ajax({
        type: "post",
        url: 'report/reportContent',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-content', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสินทรัพย์ความรู้'
                },
                subtitle: {
                    text: 'แสดงจำนวนผู้เข้าชมแต่ละหมวดหมู่สินทรัพย์ความรู้'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนผู้เข้าชม (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "หมวดหมู่",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

function con_content_barchart(format, limit, order) {
    console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);
    form_data.append('file', 0);

    $.ajax({
        type: "post",
        url: 'report/reportContent',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-content', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสินทรัพย์ความรู้'
                },
                subtitle: {
                    text: 'แสดงจำนวนผู้เข้าชมแต่ละสินทรัพย์ความรู้'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนผู้เข้าชม (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "เรื่อง",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

function con_infographic_barchart(format, limit, order) {
    console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);
    form_data.append('file', 1);

    $.ajax({
        type: "post",
        url: 'report/reportContent',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-content', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสินทรัพย์ความรู้'
                },
                subtitle: {
                    text: 'แสดงจำนวนการดาวน์โหลดอินโฟกราฟฟิกแต่ละสินทรัพย์ความรู้'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนการดาวน์โหลด (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "เรื่อง",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

function con_document_barchart(format, limit, order) {
    console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);
    form_data.append('file', 3);

    $.ajax({
        type: "post",
        url: 'report/reportContent',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-content', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลสินทรัพย์ความรู้'
                },
                subtitle: {
                    text: 'แสดงจำนวนการดาวน์โหลดเอกสารแต่ละสินทรัพย์ความรู้'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนการดาวน์โหลด (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "เรื่อง",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

var $formClinic = $("#formClinic");
$formClinic.validate({
    rules: {
        clinic_format: {
            required: true,
        },
        clinic_view: {
            required: true,
        },
        clinic_order: {
            required: true,
        }
    },
    messages: {
        clinic_format: {
            required: "กรุณาเลือกรูปแบบ Knowledge Q&A",
        },
        clinic_view: {
            required: "กรุณาเลือกจำนวนรายการที่แสดงผล",
        },
        clinic_order: {
            required: "เลือกการจัดเรียงข้อมูล",
        }
    },
    submitHandler: function() {
        var format = $('input[name="clinic_format"]:checked').val();
        var limit = $('input[name="clinic_view"]:checked').val();
        var order = $('input[name="clinic_order"]:checked').val();

        if (format == "category") {
            cli_category_barchart(format, limit, order);
        } else if (format == "clinic") {
            cli_clinic_barchart(format, limit, order);
        }

    },
    errorElement: "div",
    errorPlacement: function(error, element) {
        // Add the `invalid-feedback` class to the error element
        error.addClass("invalid-feedback");

        // Add `has-feedback` class to the parent div.form-group
        // in order to add icons to inputs
        // element.parents(".col-sm-5").addClass("has-feedback");

        if (element.prop("type") === "checkbox") {
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            element = $("#select2-" + elem.attr("id") + "-container").parent();
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        // Add the span element, if doesn't exists, and apply the icon classes to it.
        if (!element.next("span")[0]) {
            $("<span class='glyphicon glyphicon-remove form-control-feedback'></span>")
                .insertAfter(element);
        }
    },
    success: function(label, element) {
        // Add the span element, if doesn't exists, and apply the icon classes to it.
        // console.log(element);
        if (!$(element).next("span")[0]) {
            $("<span class='glyphicon glyphicon-ok form-control-feedback'></span>")
                .insertAfter(
                    $(element));
        }
    },
    highlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-error").removeClass("has-success");
        // $(element).next("span").addClass("glyphicon-remove").removeClass("glyphicon-ok");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().addClass(
                errorClass);
        } else {
            elem.addClass(errorClass);
        }
    },
    unhighlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-success").removeClass("has-error");
        // $(element).next("span").addClass("glyphicon-ok").removeClass("glyphicon-remove");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().removeClass(
                errorClass);
        } else {
            elem.removeClass(errorClass);
        }
    }
});

function cli_category_barchart(format, limit, order) {
    // console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);

    $.ajax({
        type: "post",
        url: 'report/reportClinic',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-clinic', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูล Knowledge Q&A'
                },
                subtitle: {
                    text: 'แสดงจำนวนผู้เข้าชมแต่ละห้องความรู้'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนผู้เข้าชม (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "ห้องความรู้",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

function cli_clinic_barchart(format, limit, order) {
    // console.log(format);
    var form_data = new FormData();
    form_data.append('format', format);
    form_data.append('limit', limit);
    form_data.append('order', order);

    $.ajax({
        type: "post",
        url: 'report/reportClinic',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-clinic', {
                chart: {
                    type: 'bar',
                    // height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูล Knowledge Q&A'
                },
                subtitle: {
                    text: 'แสดงจำนวนผู้เข้าชมแต่ละ Knowledge'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนผู้เข้าชม (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "หัวข้อ",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

var $formView = $("#formView");
$formView.validate({
    rules: {
        view_start: {
            required: true,
            date: true,
        },
        view_end: {
            required: true,
            date: true,
        }
    },
    messages: {
        view_start: {
            required: "กรุณาเลือกวันที่เริ่มต้น",
            date: "กรุณาเลือกวันที่",
        },
        view_end: {
            required: "กรุณาเลือกวันที่สิ้นสุด",
            date: "กรุณาเลือกวันที่",
        }
    },
    submitHandler: function() {
        var start = $('#view_start').val();
        var end = $('#view_end').val();

        view_barchart(start, end);
    },
    errorElement: "div",
    errorPlacement: function(error, element) {
        // Add the `invalid-feedback` class to the error element
        error.addClass("invalid-feedback");

        // Add `has-feedback` class to the parent div.form-group
        // in order to add icons to inputs
        // element.parents(".col-sm-5").addClass("has-feedback");

        if (element.prop("type") === "checkbox") {
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            element = $("#select2-" + elem.attr("id") + "-container").parent();
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        // Add the span element, if doesn't exists, and apply the icon classes to it.
        if (!element.next("span")[0]) {
            $("<span class='glyphicon glyphicon-remove form-control-feedback'></span>")
                .insertAfter(element);
        }
    },
    success: function(label, element) {
        // Add the span element, if doesn't exists, and apply the icon classes to it.
        // console.log(element);
        if (!$(element).next("span")[0]) {
            $("<span class='glyphicon glyphicon-ok form-control-feedback'></span>")
                .insertAfter(
                    $(element));
        }
    },
    highlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-error").removeClass("has-success");
        // $(element).next("span").addClass("glyphicon-remove").removeClass("glyphicon-ok");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().addClass(
                errorClass);
        } else {
            elem.addClass(errorClass);
        }
    },
    unhighlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-success").removeClass("has-error");
        // $(element).next("span").addClass("glyphicon-ok").removeClass("glyphicon-remove");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().removeClass(
                errorClass);
        } else {
            elem.removeClass(errorClass);
        }
    }
});

function view_barchart(start, end) {
    // console.log(format);
    var form_data = new FormData();
    form_data.append('start', start);
    form_data.append('end', end);

    $.ajax({
        type: "post",
        url: 'report/reportVisit',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            // return false;
            // console.log(result['data']);
            Highcharts.chart('chart-visit', {
                chart: {
                    type: 'bar',
                    //height: (9 / 16 * 100) + '%' // 16:9 ratio
                },
                title: {
                    text: 'กราฟข้อมูลการเข้าชมเว็บไซต์'
                },
                subtitle: {
                    text: 'แสดงจำนวนผู้เข้าชมเว็บไซต์ในแต่ละปี'
                },
                accessibility: {
                    announceNewData: {
                        enabled: true
                    }
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: 'จำนวนผู้เข้าชมเว็บไซต์ (ครั้ง)'
                    },
                    maxPadding:0
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                            format: '{point.y:.0f} ครั้ง'
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.0f}</b> ครั้ง<br/>'
                },
                series: [{
                    name: "ปี",
                    colorByPoint: true,
                    data: result['data']
                }]
            });
        }
    });
}

var $formHistory = $("#formHistory");
$formHistory.validate({
    rules: {
        history_start: {
            required: true,
            date: true,
        },
        history_end: {
            required: true,
            date: true,
        }
    },
    messages: {
        history_start: {
            required: "กรุณาเลือกวันที่เริ่มต้น",
            date: "กรุณาเลือกวันที่",
        },
        history_end: {
            required: "กรุณาเลือกวันที่สิ้นสุด",
            date: "กรุณาเลือกวันที่",
        }
    },
    submitHandler: function() {
        var start = $('#history_start').val();
        var end = $('#history_end').val();

        history_barchart(start, end);
    },
    errorElement: "div",
    errorPlacement: function(error, element) {
        // Add the `invalid-feedback` class to the error element
        error.addClass("invalid-feedback");

        // Add `has-feedback` class to the parent div.form-group
        // in order to add icons to inputs
        // element.parents(".col-sm-5").addClass("has-feedback");

        if (element.prop("type") === "checkbox") {
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            element = $("#select2-" + elem.attr("id") + "-container").parent();
            error.insertAfter(element).addClass("invalid-feedback");
        } else {
            error.insertAfter(element);
        }

        // Add the span element, if doesn't exists, and apply the icon classes to it.
        if (!element.next("span")[0]) {
            $("<span class='glyphicon glyphicon-remove form-control-feedback'></span>")
                .insertAfter(element);
        }
    },
    success: function(label, element) {
        // Add the span element, if doesn't exists, and apply the icon classes to it.
        // console.log(element);
        if (!$(element).next("span")[0]) {
            $("<span class='glyphicon glyphicon-ok form-control-feedback'></span>")
                .insertAfter(
                    $(element));
        }
    },
    highlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-error").removeClass("has-success");
        // $(element).next("span").addClass("glyphicon-remove").removeClass("glyphicon-ok");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().addClass(
                errorClass);
        } else {
            elem.addClass(errorClass);
        }
    },
    unhighlight: function(element, errorClass, validClass) {
        // $(element).parents(".col-sm-5").addClass("has-success").removeClass("has-error");
        // $(element).next("span").addClass("glyphicon-ok").removeClass("glyphicon-remove");
        var elem = $(element);
        if (elem.hasClass("select2-hidden-accessible")) {
            $("#select2-" + elem.attr("id") + "-container").parent().removeClass(
                errorClass);
        } else {
            elem.removeClass(errorClass);
        }
    }
});

function history_barchart(start, end) {
    var form_data = new FormData();
    form_data.append('start', start);
    form_data.append('end', end);

    $.ajax({
        type: "post",
        url: 'report/reportHistory',
        data: form_data,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
        cache: false,
        success: function(result) {
            $('#table-log').empty();
            $('#table-log').html(result);
        }
    });
}
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.back.master', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /var/www/html/km-web/resources/views/backOffice/report.blade.php ENDPATH**/ ?>