<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp" %>
<html>
<head>
    <title>物资领用管理</title>
    <meta name="decorator" content="ani"/>
    <link rel="stylesheet" href="${ctxStatic}/common/css/form.css">
    <link rel="stylesheet" href="${ctxStatic}/plugin/bootstrapTable/bootstrap-table.min.css">
    <script type="text/javascript" src="${ctxStatic}/plugin/bootstrapTable/bootstrap-table.min.js"></script>
    <script type="text/javascript" src="${ctxStatic}/plugin/bootstrapTable/bootstrap-table-zh-CN.js"></script>
</head>
<body>
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-primary">
                <div class="panel-body">
                    <form:form id="inputForm" modelAttribute="materialRequisition"
                               action="${ctx}/warehouse/materialrequisition/materialRequisition/save" method="post"
                               class="form-horizontal">
                        <form:hidden path="id"/>
                        <h3 class="物资领用表"></h3>
                        <table class="table table-bordered main-table">
                            <tr>
                                <td> <font color="red">*</font>领用单号</td>
                                <td>
                                    <form:input path="number" htmlEscape="false" readonly="true" class="form-control required"/>
                                </td>
                                <td><font color="red">*</font>操作人</td>
                                <td>
                                    <sys:userselect id="operator" name="operator.id"
                                                    value="${materialRequisition.operator.id}" labelName="operator.name"
                                                    labelValue="${materialRequisition.operator.name}" disabled="disabled"
                                                    cssClass="form-control required"/>
                                </td>
                            </tr>
                            <tr>
                                <td><font color="red">*</font>领用机构</td>
                                <td>
                                    <sys:treeselect id="office" name="office.id" value="${materialRequisition.office.id}"
                                                    labelName="" labelValue="${materialRequisition.office.name}"
                                                    title="部门" url="/sys/office/treeData?type=2" cssClass="form-control required"
                                                    allowClear="true" notAllowSelectParent="true"/>
                                </td>
                                <td><font color="red">*</font>领用时间</td>
                                <td>
                                    <div class='input-group form_datetime' id='time'>
                                        <input type='text' name="time" class="form-control "
                                               value="<fmt:formatDate value="${materialRequisition.time}" pattern="yyyy-MM-dd HH:mm:ss"/>"/>
                                        <span class="input-group-addon">
								        <span class="glyphicon glyphicon-calendar"></span>
                                    </span>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td>备注</td>
                                <td>
                                    <form:textarea path="remarks" htmlEscape="false" rows="4" class="form-control "/>
                                </td>
                            </tr>
                        </table>
                        <div class="tabs-container">
                            <ul class="nav nav-tabs">
                                <li class="active"><a data-toggle="tab" href="#tab-1"
                                                      aria-expanded="true">领用明细表：</a>
                                </li>
                            </ul>
                            <div class="tab-content">
                                <div id="tab-1" class="tab-pane fade in  active">
                                    <a class="btn btn-white btn-sm"
                                       onclick="addRow('#materialRequisitionInfoList', materialRequisitionInfoRowIdx, materialRequisitionInfoTpl);materialRequisitionInfoRowIdx = materialRequisitionInfoRowIdx + 1;"
                                       title="新增"><i class="fa fa-plus"></i> 新增</a>
                                    <table class="table table-striped table-bordered table-condensed">
                                        <thead>
                                        <tr>
                                            <th class="hide"></th>
                                            <th>物资领用主表ID</th>
                                            <th>物资台账明细ID</th>
                                            <th>领用人</th>
                                            <th>备注信息</th>
                                            <th width="10">&nbsp;</th>
                                        </tr>
                                        </thead>
                                        <tbody id="materialRequisitionInfoList">
                                        </tbody>
                                    </table>
                                    <script type="text/template" id="materialRequisitionInfoTpl">//<!--
				<tr id="materialRequisitionInfoList{{idx}}">
					<td class="hide">
						<input id="materialRequisitionInfoList{{idx}}_id" name="materialRequisitionInfoList[{{idx}}].id" type="hidden" value="{{row.id}}"/>
						<input id="materialRequisitionInfoList{{idx}}_delFlag" name="materialRequisitionInfoList[{{idx}}].delFlag" type="hidden" value="0"/>
					</td>
					
					<td>
						<input id="materialRequisitionInfoList{{idx}}_materialRequisition" name="materialRequisitionInfoList[{{idx}}].materialRequisition.id" type="text" value="{{row.materialRequisition.id}}"    class="form-control "/>
					</td>
					
					
					<td>
						<input id="materialRequisitionInfoList{{idx}}_ledgerInfo" name="materialRequisitionInfoList[{{idx}}].ledgerInfo.id" type="text" value="{{row.ledgerInfo.id}}"    class="form-control "/>
					</td>
					
					<td>
						<input id="materialRequisitionInfoList{{idx}}_receiver" name="materialRequisitionInfoList[{{idx}}].receiver" type="text" value="{{row.receiver.id}}"    class="form-control "/>
					</td>

					<td>
						<textarea id="materialRequisitionInfoList{{idx}}_remarks" name="materialRequisitionInfoList[{{idx}}].remarks" rows="4"    class="form-control ">{{row.remarks}}</textarea>
					</td>
					
					<td class="text-center" width="10">
						{{#delBtn}}<span class="close" onclick="delRow(this, '#materialRequisitionInfoList{{idx}}')" title="删除">&times;</span>{{/delBtn}}
					</td>
				</tr>//-->
                                    </script>
                                    <script type="text/javascript">
                                        var materialRequisitionInfoRowIdx = 0,
                                            materialRequisitionInfoTpl = $("#materialRequisitionInfoTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g, "");
                                        $(document).ready(function () {
                                            var data = ${fns:toJson(materialRequisition.materialRequisitionInfoList)};
                                            for (var i = 0; i < data.length; i++) {
                                                addRow('#materialRequisitionInfoList', materialRequisitionInfoRowIdx, materialRequisitionInfoTpl, data[i]);
                                                materialRequisitionInfoRowIdx = materialRequisitionInfoRowIdx + 1;
                                            }
                                        });
                                    </script>
                                </div>
                            </div>
                        </div>
                        <c:if test="${mode == 'add' || mode=='edit'}">
                            <div class="col-lg-3"></div>
                            <div class="col-lg-6">
                                <div class="form-group text-center">
                                    <div>
                                        <button class="btn btn-primary btn-block btn-lg btn-parsley"
                                                data-loading-text="正在提交...">提 交
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </c:if>
                    </form:form>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">

    $(document).ready(function() {
        jp.ajaxForm("#inputForm",function(data){
            if(data.success){
                jp.success(data.msg);
                jp.go("${ctx}/warehouse/materialrequisition/materialRequisition");
            }else{
                jp.error(data.msg);
                $("#inputForm").find("button:submit").button("reset");
            }
        });

        $('#time').datetimepicker({
            format: "YYYY-MM-DD HH:mm:ss"
        });
    });
</script>
</body>
</html>