<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../lib/app/css/app.min.css">
<link rel="stylesheet" href="../../lib/simple-line-icons/css/simple-line-icons.css">
<link rel="stylesheet" href="../../lib/bootable/bootstrap-table.css">
<link rel="stylesheet" href="../../lib/webo/css/ui.css">
<link rel="stylesheet" href="../../lib/toastr/toastr.css">
<link rel="stylesheet" href="../../static/css/top_page.css">
<body>
<div class="app app-header-fixed app-aside-fixed">
    <header id="header" class="app-header navbar" role="menu">
        {{template "com/purchasetop.tpl" .}}
    </header>

        <div class="row">
            <div class="col-md-10" style="padding-left: 30px">
                <a id="add_item" class="btn btn-primary">创建</a>
            </div>
            <div>
                <ul class="nav navbar-nav active">
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-filter"></i>筛选<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#" data-tab="tab-chrome">任务管理</a></li>
                            <li><a href="#" data-tab="tab-firefox">信息管理</a></li>
                            <li><a href="#" data-tab="tab-safari">工时管理</a></li>
                            <li><a href="#" data-tab="tab-opera">合同管理</a></li>
                            <li><a href="#" data-tab="tab-ie">产品管理</a></li>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-bars"></i>分组<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#" data-tab="tab-chrome">任务管理</a></li>
                            <li><a href="#" data-tab="tab-firefox">信息管理</a></li>
                            <li><a href="#" data-tab="tab-safari">工时管理</a></li>
                            <li><a href="#" data-tab="tab-opera">合同管理</a></li>
                            <li><a href="#" data-tab="tab-ie">产品管理</a></li>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-star"></i>收藏<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#" data-tab="tab-chrome">任务管理</a></li>
                            <li><a href="#" data-tab="tab-firefox">信息管理</a></li>
                            <li><a href="#" data-tab="tab-safari">工时管理</a></li>
                            <li><a href="#" data-tab="tab-opera">合同管理</a></li>
                            <li><a href="#" data-tab="tab-ie">产品管理</a></li>
                        </ul>
                    </li>

                </ul>
            </div>
        <div>
            <table id="item_table"
                   data-show-refresh="false"
                   data-show-columns="false"
                   data-show-export="false"
                   data-search="false"
                   data-page-size="100"
                   data-row-style="rowStyleOvertime"
                   data-filter-control="false"
                   data-query-params="queryParams"
                   data-show-footer="false"
                   data-toolbar=".toolbar">
                <thead>
                <tr>
                    <th data-field="action"
                        data-align="center"
                        data-formatter="actionFormatter"
                        data-events="actionEvents"
                        data-sortable="false"
                        data-width="10px"> [ 操作 ]
                    </th>
                    <th data-field="number" data-filter-control="input" >编号</th>
                    <th data-field="buyersn" data-filter-control="input">供应商</th>
                    <th data-field="product" data-filter-control="input">产品</th>
                    <th data-field="unit" data-filter-control="input">单位</th>
                    <th data-field="num" data-filter-control="input">数量</th>
                    <th data-field="requisitioner" data-filter-control="input" data-extend-label="name">请购人</th>
                    <th data-field="purchaser" data-filter-control="input" data-extend-label="name">采购员</th>
                    <th data-field="bill" data-filter-control="input">源单据</th>
                    <th data-field="status" data-filter-control="input">状态</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>
<div id="RemoveModel" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">删除</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal padder-md" id="AgreeForm" enctype="multipart/form-data">
                    <div class="form-group">
                        <label class="control-label">确定删除该条记录？</label><br/>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button id="btnRemove" type="button" class="btn btn-primary">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>
<script src="../../lib/app/js/app.min.js"></script>
<script src="../../lib/bootable/bootstrap-table.js"></script>
<script src="../../lib/webo/js/ui.js"></script>
<script src="../../lib/toastr/toastr.js"></script>
<script src="../../lib/jquery/jquery/validate/jquery.metadata.js"></script>
<script src="../../lib/jquery/jquery/jquery.form.js"></script>
<script src="../../lib/jquery/jquery-ui/jquery-ui.min.js"></script>
<script src="../../lib/webo/js/validate.js"></script>
<script>
    var $table = $("#item_table");
    $(function () {
        $table.bootstrapTable({
            url: "/item/list/purchase",
            method: "post",
            sidePagination: "server",
            pagination: true,
            height: getTableHeight(),
            fixedColumns: true,
            fixedNumber: 1
        });
        $("#add_item").on("click", function () {
            window.location.href = "/purchase/ui/add"
        });
        $(window).resize(function () {
            $table.bootstrapTable('resetView', {
                height: getTableHeight()
            });
        });
    });
    function getTableHeight() {
        return 800;
    }
    function refreshContent(options) {
        $table.bootstrapTable("refresh")
    }
    function actionFormatter(value, row) {
        str ='<a class ="update text-primary" href="javascript:" title="修改" style="margin-right: 5px;">修改</a>'+
            '<a class ="remove text-primary" href="javascript:" title="删除" style="margin-right: 5px;">删除</a>';
        return str
    }
    window.actionEvents = {
        'click .update': function (e, value, row) {
            window.location = "/purchase/ui/update?sn=" + row.sn
        },
        'click .remove': function (e, value, row) {
            $('#RemoveModel').modal({backdrop:"static"});
            $("#btnRemove").off("click").on("click", function () {
                $.ajax({
                    url:"/item/delete/purchase",
                    type:"post",
                    data:{
                        sn:row.sn
                    },
                    success: function () {
                        $('#RemoveModel').modal("hide");
                        $table.bootstrapTable("refresh")
                    }
                })
            })
        }
    }
</script>
</body>
</html>