{% extends 'baseBZP.html' %}

{% block content %}

{% load static %}


<style type="text/css">
    .dataTables_filter {
    display:none
    }


</style>
<div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
        <div class="layui-form-item">

              <div class="layui-inline">
                <label class="layui-form-label">起始时间</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="startDate" ReserveSearch='' name="searchValue" placeholder="起始时间" value="{{last_year}}">
                </div>
              </div>
              <div class="layui-inline">
                <label class="layui-form-label">结束时间</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="endDate" ReserveSearch='' name="searchValue" placeholder="结束时间" value="{{today}}">
                </div>
              </div>
              <div class="layui-inline">
                <label class="layui-form-label">搜索</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="searchValue" ReserveSearch='' name="searchValue" placeholder="搜索用户类型、操作类型">
                </div>
              </div>

              <div class="layui-inline" style="height: 42px;">
                  <button type="button" class="layui-btn layuiadmin-btn-useradmin" data-type="btnTableSearch">
                    <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                  </button>
                </div>
        </div>
      </div>
      <div class="layui-card-body">
        <div style="padding-bottom: 10px;">
           
            <button type="button" class="layui-btn layuiadmin-btn-useradmin" data-type="btnTableReload" style="margin-right:3px;" data-toggle="tooltip" data-placement="left" title="刷新统计列表"><i class="fa fa-refresh" aria-hidden="true"></i>刷新</button>

        </div>
        
        <table id="demo" lay-filter="test" lay-data="{id: 'idTest'}"></table>

      </div>
    </div>
</div>


{#<link href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"  rel="stylesheet" type="text/css"/>#}
{#<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>#}
{#<script src="{% static 'js/plugins/datapicker/bootstrap-datepicker.js' %}"></script>#}
{#<script src="{% static 'js/utils.js' %}"></script>#}

{% load static %}
    <script src="{% static 'js/fileDownload.js' %}"></script>
<script src="{% static 'js/plugins/datapicker/bootstrap-datepicker.js' %}"></script>
    <script src="{% static 'js/utils.js' %}"></script>
                    <script src="{% static 'js/warning.js' %}"></script>

<script type="text/javascript">
 var startDate='{{last_year}}';
 var endDate='{{today}}';
 //年月选择器
 var laydate = layui.laydate;
    //年月选择器
    laydate.render({ 
  elem: '#startDate',
  type: 'datetime',
  format: "yyyy-MM-dd HH:mm:ss"
});
laydate.render({ 
  elem: '#endDate',
  type: 'datetime',
  format: "yyyy-MM-dd HH:mm:ss",
});
var table = layui.table;
    let dataTable = []
    //执行渲染
    table.render({
        elem: '#demo', //指定原始表格元素选择器（推荐id选择器）
        // height: 312, //容器高度
        cols: [
            [{type: 'checkbox', fixed: 'left'},
            { field: 'OperateDate', title: '操作时间', width: 240, sort: true },
            { field: 'OperateUserName', title: '操作用户', width: 110, sort: true },
            { field: 'IPAddress', title: 'IP地址', width: 200, sort: true },
            { field: 'OperateType', title: '操作类型', width: 140, sort: true },
            { field: 'ExecuteResult', title: '执行结果内容', width: 220, sort: true },
            ]
        ], //设置表头
        url: "{% url 'log:getLogListJson' %}",
        id: "test",
        page: {
          layout: [ 'count', 'prev', 'page', 'next',], //自定义分页布局
          prev:'上一页',
          next:'下一页'
         },
        where: {
            startDate:startDate,
            endDate:endDate
        },
        limit: 15,
        limits: [10, 15, 20, 25, 30],
        height: 'full-160',
        size:'lg',

        done: function (res, curr, count) {
        },
    });

    var active = {
        btnTableSearch: function () {
            table.reload('test', {
            where: { //设定异步数据接口的额外参数，任意设
                searchValue:  $("#searchValue").val(),
                startDate:  $('#startDate').val(),
                endDate:  $('#endDate').val()
                //…
            },page: {
                curr: 1 //重新从第 1 页开始
            }
        }) //只重载数据
        },
        btnTableReload: function(){
            location.reload();
        },
      
    };

    $('.layui-btn.layuiadmin-btn-useradmin').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });



     $.fn.dataTable.ext.search.push(
    function (settings, data, dataIndex) {
        var min = new Date($('#startDate').val());
        var max = new Date($('#endDate').val());

        var date = new Date(data[0]) || 0; // use data for the age column

        if ((isNaN(min) && isNaN(max)) ||
             (isNaN(min) && date <= max) ||
             (min <= date && isNaN(max)) ||
             (min <= date && date <= max)) {
            return true;
        }
        return false;
    });

    $(function () {
        $('#navTitle', window.parent.document).text('日志数据');
        searchValue = $('#searchValue').val();
        $('#searchValue').text(searchValue);
        var tableModel = $('#dataTableModel').DataTable(
            {//searching: false,
            lengthChange: false,
            select: true,
            ordering: false,
            // 档处理大数据时, 延迟渲染数据, 有效的提高了Datatabale处理能力
            deferRender:true,
                // 后端分页
                searching: false,
                serverSide:true ,
                bPaginate:true, //是否显示（应用）分页器
                iDisplayLength:10,
                sLoadingRecords: true,
                Info: true,  // 显示表格左下角信息
                destroy: true,//解决Cannot reinitialise DataTable
                bProcessing: true,
                oLanguage: { 
            sProcessing: "数据加载中...", 
        },


         /*     ajax: {
                url: "",
                data: { searchValue: searchValue },
                dataSrc: 'data',
            },*/
              ajax: function(data, callback, settings){
                    var params = {};
                    params.startIndex  = data.start;
                    params.pageSize = 10;
                    params.page =  (data.start / 10)+1;
                    startDate = $('#startDate').val();
                    endDate = $('#endDate').val()
                    $.ajax({
                        async:true,
                        maskLoad:true,
                        url: "{% url 'log:getLogListJson' %}",
                        data: {
                            searchValue: searchValue,
                            params: JSON.stringify(params),
                            startDate:startDate,
                            endDate: endDate,
                        },
                        success: function(result){
                            var returnData = {};
                            returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                            returnData.recordsTotal = result.total;//返回数据全部记录 总共数据的长度
                            returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
                            returnData.data = result.data;//返回的数据列表
                            callback(returnData)
                        },
                    })
                },
            columns: [
            { data: 'OperateDate' },
            { data: 'OperateUserName' },
            { data: 'IPAddress' },
            { data: 'OperateType' },
            { data: 'ExecuteResult' }
            ],
            createdRow: function (row, data, dataIndex) {
                $(row).children('td').eq(0).html(replace_time(data.OperateDate))
            },




        });

      /*  ajax: function(data, callback, settings){
            var params = {};
            params.startIndex  = data.start;
            params.pageSize = 10;
            params.page =  (data.start / 10)+1;
        }*/



        $("#btnTableEdit").click(function () {
            var selectRow = tableModel.row('.selected').data();
            if (selectRow == null) {
                layer.msg("请选择要编辑的数据！");
                return;
            }
            parent.layer.open({
                title: "编辑药剂",
                shift: 2,
                type: 2,
                area: ['860px', '520px'],
                //skin: 'layui-layer-rim', //加上边框
                content: ['@Url.Content("~/Drug/Form?drugId=")' + selectRow.drugId, 'no'],
                end: function () {
                    tableModel.ajax.reload();
                }
            });
        });



        　　
         /*   if (iframe.attachEvent) {
                iframe.attachEvent("onload", function() {
                    //iframe加载完成后你需要进行的操作
                    console.log('触发');
                    alert(1)
                });
            } else {
                iframe.onload = function () {
                     console.log('触发122');
                    alert(221)
                    //iframe加载完成后你需要进行的操作
                };
            } */


         $("#btnTableExport").click(function () {
             var index = '';
              var url = "{% url 'log:exportLogData' %}";
         $.fileDownload(url,{
            httpMethod: 'GET',
            prepareCallback:function(url){
             index = parent.layer.load(2,{time: 3*1000});
            },
            successCallback:function(url){
                console.log('下载完成');
               parent.layer.close(index)
            },
            failCallback: function (html, url) {
               console.log('文件下载失败');
               parent.layer.close(index)
            }
         });
        });
        $("#btnTableDelete").click(function () {
            var selectRow = tableModel.row('.selected').data();
            if (selectRow == null) {
                layer.msg("请选择要删除的数据！");
                return;
            }
            parent.layer.confirm('确定要删除药剂“' + selectRow.name + '（' + selectRow.drugId + '）”', function (index) {
                parent.layer.close(index);
                $.post('@Url.Content("~/Drug/DeleteDrug")', { drugId: selectRow.drugId }, function (obj) {

                    if (obj.status == 1) {
                        layer.msg("删除成功！");
                        tableModel.row('.selected').remove().draw(false);
                    }
                    else {
                        layer.msg("删除失败！");
                    }
                })
            });
        });
   function replace_time(params) {
            if(params){
               return params.replace('T', ' ')
           }
        }
    });
</script>

    <iframe src=""  width=0 height=0 frameborder="0" id="export"></iframe>
{% endblock %}