{% extends 'base.html' %}


{% block content %}

<div class="wrapper wrapper-content animated fadeInDown">
    <div class="mail-box-header">
        <form method="get" action="~/Drug/Index" class="pull-right mail-search" accept-charset="UTF-8">
            <div class="input-group">
                <input type="text" class="form-control" id="searchValue" name="searchValue" placeholder="搜索关键字">
                <div class="input-group-btn">
                    <button type="button" id="btnTableSearch" class="btn btn-primary">
                        搜索
                    </button>
                </div>
            </div>
        </form>
        <h2>
            用户角色数据统计报表
        </h2>
        <div class="mail-tools tooltip-demo m-t-md">
            <div class="btn-group pull-right">
                <a type="submit" class="btn btn-primary btn-sm" href="{% url 'dataReport:index' %}">
                    返回统计目录
                </a>
            </div>
            <button class="btn btn-white btn-sm" data-toggle="tooltip" id="btnTableReload" data-placement="left" title="刷新统计列表"><i class="fa fa-refresh"></i> 刷新</button>
            <button class="btn btn-white btn-sm" data-toggle="tooltip" id="btnTableExport" data-placement="left" title="导出报表统计列表"><i class="fa fa-download"></i> 导出报表</button>
            {#            @*<button class="btn btn-white btn-sm" data-toggle="tooltip" id="btnTableChart" data-placement="left" title="以图表形式显示统计数据"><i class="fa fa-pie-chart"></i> 图表统计</button>*@#}
        </div>
    </div>
    <div class="ibox-content">
        <table id="dataTableModel" class="table table-striped table-bordered table-hover dataTables-example">
            <thead>
                <tr>
                    <th>工号</th>
                    <th>角色</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>QQ</th>
                    <th>电话</th>
                    <th>邮箱</th>
                    <th>条码</th>
                    <th align="center">状态</th>
                    <th>创建时间</th>

                </tr>
            </thead>
            <tbody></tbody>
            <tfoot>
                <tr>
                    <th>工号</th>
                    <th>角色</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>QQ</th>
                    <th>电话</th>
                    <th>邮箱</th>
                    <th>条码</th>
                    <th align="center">状态</th>
                    <th>创建时间</th>
                </tr>
            </tfoot>
        </table>
    </div>
</div>
{% load static %}
    <script src="{% static 'js/fileDownload.js' %}"></script>
        <script src="{% static 'js/warning.js' %}"></script>

<script type="text/javascript">

    $(function () {

        var tableModel = $('#dataTableModel').DataTable({
            //searching: false,
            lengthChange: false,
            select: true,
            //"scrollX": true,
            ajax: {
                url: '{% url 'user:getUserListJson' %}',
                data: {},
                dataSrc: 'data',
            },
            columns: [
            { data: 'UserCode' },
            { data: 'RoleName' },
            { data: 'RealName' },
            { data: 'Sex' },
            { data: 'QQ' },
            { data: 'Mobile' },
            { data: 'Email' },
            { data: 'BarCode' },
            { data: 'IsEnabled' },
            { data: 'CreateDate' }
            ],
            createdRow: function (row, data, dataIndex) {
                $(row).children('td').eq(3).html(data.Sex == 1 ? "男" : "女");
                $(row).children('td').eq(7).html((data.BarCode == null || data.BarCode == "") ? "<span class='label label-default'>未绑定</span>" : "<span class='label label-primary'>" + data.BarCode + "</span>");
                $(row).children('td').eq(8).html(data.IsEnabled == 1 ? "<span class='label label-warning'>正常</span>" : "<span class='label label-default'>禁用</span>");
                $(row).children('td').eq(8).attr('style', 'text-align: center;')
                $(row).children('td').eq(9).html(replace_time(data.CreateDate))
            },
            "order": [[9, "desc"]]
        });
        $("#btnTableSearch").click(function () {

            tableModel.search($("#searchValue").val()).draw();
        });
        $("#searchValue").keyup(function () {
            tableModel.search($("#searchValue").val()).draw();

        })
        $("#btnTableReload").click(function () {
            location.href = '{% url 'dataReport:userList' %}';
        });

        $("#tablePre").click(function () {
            $("#dataTableModel_previous").click();

        })
        $("#btnTableChart").click(function () {
            parent.layer.open({
                title: "图表统计",
                shift: 2,
                type: 2,
                area: ['1000px', '500px'],
                skin: 'layui-layer-rim', //加上边框
                content: ['@Url.Content("~/DataReport/DrugRecordChart")', 'no'],
                end: function () {
                    tableModel.ajax.reload();
                }
            });
        });
        $("#tableNext").click(function () {
            $("#dataTableModel_next").click();

        });

        $("#btnTableExport").click(function () {
             var index = '';
             var url = '{% url 'dataReport:exportUserData' %}';
             var index = parent.layer.load(2,{time: 3*1000});
             var visitType=window.parent.frames.getUrlParam('visitType');
            if(((visitType=='1') || (visitType=='2')))
            {
                $.get(url+"?visitType=1", function (obj) {
                                parent.layer.close(index);
                                if (obj.status == 0) {
                                    new $.flavr({ content : '导出成功！',
                                    autoclose : true, timeout : 800 });
                                    tableModel.row('.selected').remove().draw(false);
                                    return false;
                                }
                                else {
                                    new $.flavr({ content : obj.message,
                                    autoclose : true, timeout : 2000 });
                                    return false;
                                }
                            });
                        }
                        else{
                            $.fileDownload(url, {
                                httpMethod: 'GET',
                                prepareCallback: function (url) {
                                    index = parent.layer.load(2,{time: 3*1000});
                                },
                                successCallback: function (url) {
                                    parent.layer.close(index)
                                },
                                failCallback: function (url) {
                                    msg('数据异常, 下载失败');
                                    parent.layer.close(index)
                                }
                            });
                }

        });

        $('#searchValue').focus(function () {
            $(this).keydown(function () {
                switch (event.keyCode) {
                    case 13:
                        return false;
                }
            })
        });

   function replace_time(params) {
           if(params){
               return params.replace('T', ' ')
           }
        }
    });
</script>
<iframe width=0 height=0 frameborder=0 id="export" />



{% endblock %}