JW/EMIS.Web/Views/Student/ReportExport.cshtml

@using Bowin.Web.Controls.Mvc;
@using EMIS.Entities;
@using EMIS.Web.Controls;
@{
    ViewBag.Title = "ReportExport";
}
<link href="~/Content/Bowin.Control.Core/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="~/Content/Bowin.Control.Core/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="~/Content/Bowin.Control.Core/themes/icon.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-ui.min.js" type="text/javascript"></script>
<script src="~/Scripts/jquery.min.js" type="text/javascript"></script>
<script src="~/Scripts/Bowin.Control.Core/Plugins/EasyUI/jquery.easyui.min.js" type="text/javascript"></script>
<style type="text/css">
        .drag{
            padding:4px;
            margin:2px;
            border:1px solid #ccc;
            background:#AACCFF;
        }
        .dp{
            opacity:0.5;
            filter:alpha(opacity=50);
        }
        .over{
            background:#FBEC88;
        }
        .indicator{
            position:absolute;
            font-size:9px;
            width:10px;
            height:10px;
            display:none;
            color:red;
        }
        .drag-item{
            padding:4px;
            margin:2px;
            border:1px solid #ccc;
            background:#AACCFF;
        }
        input[type=button] 
        {
            background-color:#f0f0f0;
        }
</style>
@section scripts{
    <script type="text/javascript">
        var windowID = "";
        var fileUrl = "";
        $(function () {
            windowID = $.SystemGeneral.getUrlParam("WindowID");
            var customerUrl = $(CMS_SystemConfig.GetConfig()).find("configuration>customUrls>add[key='StudentColumnName']");
            if (customerUrl.attr("value")) {
                fileUrl = "../.." + customerUrl.attr("value");
            } else {
                fileUrl = "../../Config/ConfigTemplateFile/StudentColumnName.json";
            }
            setLeftDiv();
        });

        function setdraggableanddroppable() {
            $('.drag').draggable({
                proxy: 'clone',
                revert: true,
                cursor: 'auto',
                onStartDrag: function () {
                    $(this).draggable('options').cursor = 'not-allowed';
                    $(this).draggable('proxy').addClass('dp');
                },
                onStopDrag: function () {
                    $(this).draggable('options').cursor = 'auto';
                }
            });
            $('#target').droppable({
                deltaX: 0,
                deltaY: 0,
                onDragEnter: function (e, source) {
                    $(source).draggable('options').cursor = 'auto';
                    $(source).draggable('proxy').css('border', '1px solid red');
                    $(this).addClass('over');
                },
                onDragLeave: function (e, source) {
                    $(source).draggable('options').cursor = 'not-allowed';
                    $(source).draggable('proxy').css('border', '1px solid #ccc');
                    $(this).removeClass('over');
                },
                onDrop: function (e, source) {
                    source.className = "drag";
                    var x = event.clientX;
                    var y = event.clientY;
                    var lis = $("#target").find("div");
                    if (lis.length > 0) {
                        var number = 0;
                        $.each(lis, function (index, item) {
                            var divtop = lis.eq(index).position().top;
                            //var thistop = lis.eq(index).offset().top;
                            var scrollTop = $(this).parent().scrollTop();
                            var targettop = $(this).parent().position().top;
                            var divheight = $(this).height();
                            if (source.id == item.id) {
                                return true;
                            }
                            if (divtop + scrollTop - targettop + divheight - (y - targettop + scrollTop) >= 0) {
                                number = index + 1;
                                return false;
                            }
                        });
                        if (number == 0) {
                            $(this).append(source);
                        } else {
                            var nametext = lis.eq(number - 1).attr("name");
                            $("[name='" + nametext + "']").before(source);
                            //$(lis.eq(2)).append(source);
                        }
                    }
                    else {
                        $(this).append(source);
                    }
                    $(this).removeClass('over');
                }
            });
            $('#source').droppable({
                //accept: '#d1,#d3',
                onDragEnter: function (e, source) {
                    $(source).draggable('options').cursor = 'auto';
                    $(source).draggable('proxy').css('border', '1px solid red');
                    $(this).addClass('over');
                },
                onDragLeave: function (e, source) {
                    $(source).draggable('options').cursor = 'not-allowed';
                    $(source).draggable('proxy').css('border', '1px solid #ccc');
                    $(this).removeClass('over');
                },
                onDrop: function (e, source) {
                    $(this).append(source);
                    $(this).removeClass('over');
                }
            });
        };

        //查询LeftDiv
        function setLeftDiv() {
            $.getJSON(fileUrl, function (result) {
                $.each(result.all, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '" class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //全部
        function getAll() {
            $('#target').find('div').remove();
            $.getJSON(fileUrl, function (result) {
                $.each(result.all, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '"class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source #' + i).remove();
                        $('#target').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //新生学籍电子注册上报
        function getNewStudentReport() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setLeftDiv();
            $.getJSON(fileUrl, function (result) {
                $.each(result.stu_newStudentReport, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '"class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source #' + i).remove();
                        $('#target').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //在校生数据批量修改上报
        function getInSchoolEditReport() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setLeftDiv();
            $.getJSON(fileUrl, function (result) {
                $.each(result.stu_inSchoolEditReport, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '"class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source #' + i).remove();
                        $('#target').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //在校生学年电子注册上报
        function getInSchoolReport() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setLeftDiv();
            $.getJSON(fileUrl, function (result) {
                $.each(result.stu_inSchoolReport, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '"class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source #' + i).remove();
                        $('#target').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //毕业生学历电子注册上报
        function getGradReport() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setLeftDiv();
            $.getJSON(fileUrl, function (result) {
                $.each(result.stu_gradReport, function (i, field) {
                    var colList = eval(field);
                    for (var key in colList) {
                        var str = '<div id="' + i + '"class="drag" name="' + key + '">' + i + '(' + colList[key] + ') </div>'
                        $('#source #' + i).remove();
                        $('#target').append(str);
                    }
                });
                setdraggableanddroppable();
            });
        };

        //清空
        function removeRight() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setLeftDiv();
        }

        //查询Request
        function GetRequest() {
            var url = location.search; //获取url中"?"符后的字串 
            var theRequest = new Object();
            if (url.indexOf("?") != -1) {
                var str = url.substr(1);
                strs = str.split("&");
                for (var i = 0; i < strs.length; i++) {
                    theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                }
            }
            return theRequest;
        }

        //DBF
        function Student_ReportDBFExport() {
            var Request = new Object();
            Request = GetRequest();
            $("#userIDs").val(Request["userIDs"]);
            var dgStudentList = top.$("#" + windowID).data("inputData");
            $("#queryParamsDatas").val(dgStudentList.QueryParamsDatas);
            var colnames = "";
            var shownames = "";
            $('#target').children('div').each(function () {
                colnames = colnames + $(this).attr('id') + ",";
            });
            $('#target').children('div').each(function () {
                shownames = shownames + $(this).attr('name') + ",";
            });
            $("#colnames").val(colnames);
            $("#shownames").val(shownames);
            if (colnames == null || colnames == "" || shownames == null || shownames == "") {
                $.messager.alert("系统提示", "请选择需要打印的字段。");
                return;
            }
            $(document.forms[0]).attr("action", CMS_SystemConfig.VirtualDirectoryPath + "/Student/ReportDBFExport");
            //$(document.forms[0]).submitWithLoading();
            $(document.forms[0]).submit();
        }

        //Excel
        function Student_ReportExcelExport() {
            var Request = new Object();
            Request = GetRequest();
            $("#userIDs").val(Request["userIDs"]);
            var dgStudentList = top.$("#" + windowID).data("inputData");
            $("#queryParamsDatas").val(dgStudentList.QueryParamsDatas);
            var colnames = "";
            var shownames = "";
            $('#target').children('div').each(function () {
                colnames = colnames + $(this).attr('id') + ",";
            });
            $('#target').children('div').each(function () {
                shownames = shownames + $(this).attr('name') + ",";
            });
            $("#colnames").val(colnames);
            $("#shownames").val(shownames);
            if (colnames == null || colnames == "" || shownames == null || shownames == "") {
                $.messager.alert("系统提示", "请选择需要打印的字段。");
                return;
            }
            $(document.forms[0]).attr("action", CMS_SystemConfig.VirtualDirectoryPath + "/Student/ReportExcelExport");
            $(document.forms[0]).submit();
        }

    </script>
}
<div class="easyui-panel" data-options="border:false,fit:true" style="position: relative;">
    <div class="p_title">
        <div style="float: left; margin-left: 10px; line-height: 30px; font-size: 12px;"></div>
        <div style="margin-right: 10px; line-height: 30px; font-size: 12px;">@Html.ContextMenuBar("ReportExport")</div>
    </div>
    <form id="formQuery" method="post" action="@Url.Content("~/Student/ReportExcelExport")">
        @Html.Hidden("queryParamsDatas")
        @Html.Hidden("userIDs")
        @Html.Hidden("colnames")
        @Html.Hidden("shownames")
    </form>
    <div id="bodycss">
        <div style="margin:2px 0;"></div>
        <div id="buttondiv" style="margin-left:20px;">
            <div style="float:left;margin:0 4px"><input type="button" onclick="getAll()" class = "all" value="全部字段" /></div>
            <div style="float:left;margin:0 4px" ><input type="button" onclick="getNewStudentReport()" class ="stru_xjzc" value="新生学籍电子注册上报" /></div>
            <div style="float:left;margin:0 4px"><input type="button" onclick="getInSchoolEditReport()" class="stru_sjxg" value="在校生数据批量修改上报" /></div>
            <div style="float:left;margin:0 4px"><input type="button" onclick="getInSchoolReport()" class="stru_xnzc" value="在校生学年电子注册上报" /></div>
            <div style="float:left;margin:0 4px"><input type="button" onclick="getGradReport()" class="stru_jszc" value="毕业生学历电子注册上报" /></div>
            <div><input style="margin:0 4px;color:red;" type="button" onclick="removeRight()" class="stru_jszc" value="清空" /></div>
        </div>
        <div id="selectdiv">
            <div id="source" style="border:1px solid #ccc;width:300px;height:450px;float:left;margin:5px 90px;overflow:auto">
                候选字段
            </div>
            <div id="target" style="border:1px solid #ccc;width:300px;height:450px;float:left;margin:5px 0px;overflow:auto">
                需打印字段
            </div>
            <div style="clear:both;"></div>
        </div>
    </div>
</div>