<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
	<title></title>
	<meta name="decorator" content="default" />
	<script type="text/javascript">
		var validateForm;
        function doSubmit(){//回调函数，在编辑和保存动作时，供openDialog调用提交表单。
            if(validateForm.form()){
                if(  $("#month").val() == null || $("#month").val() == ''  ||$("#month").val() == undefined ){
                    top.layer.alert('请添加月份！', {icon: 0});
                    return;
                }
                if(  $("#officeId").val() == null || $("#officeId").val() == ''  ||$("#officeId").val() == undefined ){
                    top.layer.alert('请选择部门！', {icon: 0});
                    return;
                }
                if(  $("#uploadFile")[0].files[0] == null || $("#uploadFile")[0].files[0] == ''  ||$("#uploadFile")[0].files[0] == undefined ){
                    top.layer.alert('请上传文件！', {icon: 0});
                    return;
                }
                $("#inputFormExcle").submit();
                return true;
            }
            return false;
        }
		$(document).ready(function() {
			validateForm = $("#inputFormExcle").validate({
				submitHandler: function(form){
					loading('正在提交，请稍等...');
					form.submit();
				},
				errorContainer: "#messageBox",
				errorPlacement: function(error, element) {
					$("#messageBox").text("输入有误，请先更正。");
					if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
						error.appendTo(element.parent().parent());
					} else {
						error.insertAfter(element);
					}
				}
			});

            laydate.render({
                elem: '#month', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
                event: 'focus' //响应事件。如果没有传入event，则按照默认的click
                ,type: 'month',
                done: function(value){//日期时间被切换后的回调
                    console.log($("#uploadFile")[0].files[0]);
                }
            });
        });
        


        function getChange(){
           /* var layerIndex= layer.load(0,{shade: [0.3, '#fff']});
            var formData = new FormData();
            formData.append("file",$("#uploadFile")[0].files[0]);
            console.log(formData);*/
            console.log($("#uploadFile")[0].files[0]);
           /* $.ajax({
                type: 'post',
                url:'${ctx}/workexample/workExample/excel',
                data: formData,
                dataType: "json",
                cache: false,
                processData: false,
                contentType: false,
            }).success(function (result) {
                layer.close(layerIndex);
                //setExcelInfo(result.data);
            }).error(function () {
                top.layer.msg("文件载入失败！");
            });*/
        }
        function importTemplate() {
            layer.confirm('确定要下载导入模版吗？', {btn: ['确定','取消']}, function() {
            $.ajax({
                type:'post',
                url:'${ctx}/workeffectdetail/workEffectDetail/import/template',
                data:null,
                /*async: false,*/
                success:function(result){
                    console.log("231--");
                },error:function (result){
                    console.log("131--");
                }
            })
                layer.closeAll('dialog');
            });
        }
    </script>
    <style>
        /*超过5个汉字，调整label的长度，以下是配套的*/
        .layui-item .layui-form-label{
            width:90px;
        }
        .form-group .layui-item .layui-input-block,
        .query .layui-input-block {
            margin-left: 116px;
        }
    </style>
</head>
<body >
<div class="single-form">
    <div class="container">
		<form:form id="inputFormExcle" modelAttribute="workEffectExcel"  action="${ctx}/workeffect/workEffect/import"  enctype="multipart/form-data" method="post" class="form-horizontal">
            <div class="form-group layui-row first">
                <div class="layui-item layui-col-sm6">
                    <label class="layui-form-label"><span class="require-item">*</span>月份：</label>
                    <div class="layui-input-block">
                        <input id="month" name="month" style="background-color: #ffffff;" readonly="true"  htmlEscape="false" maxlength="20" readonly="true"  class="laydate-icondate form-control layer-date layui-input laydate-icon"
                               value="<fmt:formatDate value="${workEffectExcel.month}" pattern="yyyy-MM"/>"/>
                        </input>
                    </div>
                </div>
                <div class="layui-item layui-col-sm6">
                    <label class="layui-form-label"><span class="require-item">*</span>部门：</label>
                    <div class="layui-input-block with-icon">
                        <sys:treeselect id="office" name="office.id" value="${workEffectExcel.office.id}" labelName="office.name" labelValue="${workEffectExcel.office.name}"
                                        title="部门" url="/sys/office/treeDataAll?type=2" cssClass="form-control layui-input" allowClear="true" notAllowSelectParent="true"/>
                    </div>
                </div>
                <div class="layui-item layui-col-sm6">
                    <div class="layui-input-block">
                        <div class="input-group">
                            <%--<a class="nav-btn nav-btn-import" onclick="importTemplate()" ><i class="glyphicon glyphicon-import"></i>&nbsp;下载模版</a>--%>
                            <input id="uploadFile" onchange="getChange()" name="file" type="file" />导入文件不能超过5M，仅允许导入“xls”或“xlsx”文件！<br/>　
                        </div>
                    </div>
                </div>
            </div>
    <div class="form-group layui-row page-end"></div>
	</form:form>
    </div>
</div>
</body>
</html>