{% extends 'baseBZP.html' %}

{% block content %}

{% load static %}

<style type="text/css">
    .chosen-container-single .chosen-single {
        height: 25px !important;
        line-height: 25px !important;
        padding-top: 2px !important;
    }

    .sorting {
        padding: 0px
    }

    thead>tr>th {
        padding: 0px
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header" style="font-size: 20px;font-weight: bold;">库存信息总览</div>
      <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="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;">
            <a href="{% url 'dataReport:index' %}" class="layui-btn">返回统计目录</a>


            <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>

            <button type="button" class="layui-btn layuiadmin-btn-useradmin" data-type="btnTableExport" style="margin-right:3px;" data-toggle="tooltip" data-placement="left" title="导出报表"><i class="fa fa-sign-out" aria-hidden="true"></i>导出报表</button>
            <button class="btn btn-white btn-sm pull-left" style="margin-right:3px;display:none" data-toggle="tooltip"
                id="btnTableChart1" data-placement="left" title="以图表形式显示统计数据"><i class="fa fa-pie-chart"></i>
                药剂资金消耗图表统计</button>
            <button class="btn btn-white btn-sm pull-left" style="margin-right:3px;display:none" data-toggle="tooltip"
                id="btnTableChart2" data-placement="left" title="以图表形式显示统计数据"><i class="fa fa-pie-chart"></i>
                药剂库存价值图表统计</button>
        </div>

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

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

{% load static %}
<script src="{% static 'js/fileDownload.js' %}"></script>
<script src="{% static 'js/warning.js' %}"></script>

<script type="text/javascript">
    var table = layui.table;
    let dataTable = []
    //执行渲染
    table.render({
        elem: '#demo', //指定原始表格元素选择器（推荐id选择器）
        // height: 312, //容器高度
        cols: [
            [{type: 'checkbox', fixed: 'left'},
                { field: 'Name', title: '药剂名称', width: 280, sort: true },
            { field: 'CASNumber', title: 'CAS码', width: 220, sort: true },
            { field: 'Speci+" "+SpeciUnit', title: '规格', width: 110, sort: true },
            { field: 'NormalCount', title: '在库剩余数量(瓶)', width: 110, sort: true },
            { field: 'quality', title: '在库剩余总质量(g)', width: 110, sort: true },
            { field: 'Price', title: '在库总价(元)', width: 140, sort: true }]
        ], //设置表头
        url: '{% url 'dataReport:getOverviewInfoJson' %}',
        page: true,
        id: "test",
        page: {
          layout: [ 'count', 'prev', 'page', 'next',], //自定义分页布局
          prev:'上一页',
          next:'下一页'
         },
        limit: 15,
        limits: [10, 15, 20, 25, 30],
        height: 'full-240',
        size:'lg',

        done: function (res, curr, count) {
            //如果是异步请求数据方式，res即为你接口返回的信息。
            //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
            console.log(res);
            //得到当前页码
            console.log(curr);

            //得到数据总量
            console.log(count);
        },
    });
    var active = {
        btnTableSearch: function () {
            table.reload('test', {
                    where: { //设定异步数据接口的额外参数，任意设
                        name:  $("#searchValue").val()
                    },page: {
                    curr: 1 //重新从第 1 页开始
                    }
            }) //只重载数据
        },
        btnTableReload: function(){
            location.href = '{% url 'dataReport:getOverviewInfo' %}';
        },
        btnTableExport: function(){
            index = '';
            var url = '{% url 'dataReport:downOverviewInfo' %}';
            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);
                    console.log(obj)
                    if (obj.status == 0) {
                        layer.alert('导出成功！', {time:1500,btn:[],title:""});
                        tableModel.row('.selected').remove().draw(false);
                        return false;
                    }
                    else {
                        layer.alert(obj.message, {time:1500,btn:[],title:""});
                        return false;
                    }
                });
            }
            else {
                $.fileDownload(url, {
                    httpMethod: 'GET',
                    data: {
                        name: $("#searchValue").attr('ReserveSearch'),
                    },
                    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)
                    }
                });
            }
        }
    };

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


    $(function () {
        /* $.get('', function (obj) {
            $(obj.data).each(function (index, data) {
                $("#cabinetSelect").append("<option value='" + data.ClientId + "' hassubinfo='true'>" + data.ClientName + "</option>");
            });
            $(".chosen-select").chosen({
                no_results_text: "没有找到",
                disable_search: true,
                allow_single_deselect: true
            });
        }); */
        let page = 1
        var tableModel = $('#dataTableModel').DataTable({
            //searching: false,
            lengthChange: false,
            select: true,
            "scrollX": true,
            ajax: {
                url: '{% url 'dataReport:getOverviewInfoJson' %}',
                data: { page: page },
                dataSrc: 'data',
            },

            columns: [
                { data: 'Name' },
                { data: 'CASNumber' },
                { data: 'speci' },
                // { data: 'SpeciUnit' },
                { data: 'NormalCount' },
                { data: 'quality' },
                // { data: 'Price' },
                { data: 'TotalPrice' },

            ],
            createdRow: function (row, data, dataIndex) {
                console.log("尝试访问..........")
                console.log(data.Name)
                // $(row).children('td').eq(2).html(data.Speci+' '+data.SpeciUnit);
                // $(row).children('td').eq(3).html(formatIsSupervise(data.IsSupervise));
                // $(row).children('td').eq(4).html(transition_None(data.TotalCount));
                // $(row).children('td').eq(6).html(transition_None(data.UseCount));
                // $(row).children('td').eq(7).html(transition_None(data.StockPrice));
                // $(row).children('td').eq(10).html(transition_None(data.QuarterlyEmptyPrice));
                // $(row).children('td').eq(13).html(transition_None(data.YearEmptyPrice));
            }

        });
        $("#btnTableChart1").click(function () {
            quiteTime = Infinity;
            parent.layer.open({
                title: "药剂资金消耗图表统计",
                shift: 2,
                type: 2,
                area: ['850px', '650px'],
                skin: 'layui-layer-rim', //加上边框
                content: ['{% url 'dataReport:fundsConsumeChart' %}', 'no'],
                end: function () {
                    currentTime = 0;
                    quiteTime = 600;
                    tableModel.ajax.reload();
                }
            });
        });
        $("#btnTableChart2").click(function () {
            quiteTime = Infinity;
            parent.layer.open({
                title: "药剂库存价值图表统计",
                shift: 2,
                type: 2,
                area: ['850px', '650px'],
                skin: 'layui-layer-rim', //加上边框
                content: ['{% url 'dataReport:fundsNormalChart' %}', 'no'],
                end: function () {
                    currentTime = 0;
                    quiteTime = 600;
                    tableModel.ajax.reload();
                }
            });
        });
        $("#searchValue").keyup(function () {
            //mxh_后端进行搜索
            tableModel.ajax.url('/dataReport/getOverviewInfoJson/?name=' + $("#searchValue").val()).load()
            $("#searchValue").attr('ReserveSearch', $("#searchValue").val());

            tableModel.search($("#searchValue").val()).draw();

        })
        $("#btnTableReload").click(function () {

        });

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

        });

        $("#tableNext").click(function () {
            $("#dataTableModel_next").click();

        });

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



        function transition_None(params) {

            switch (params) {
                case null:
                    return 0;

            }
        }

        function formatIsSupervise(params) {
            switch (params) {
                case 0:
                    return '否';
                case 1:
                    return '是';
                default:
                    return '否'
            }
        }

    });
</script>
<script>
    $("th").css("padding-right", "0px");
</script>
<iframe width=0 height=0 frameborder=0 id="export" />


{% endblock %}