@using Bowin.Web.Controls.Mvc;
@using EMIS.Entities;
@using EMIS.Web.Controls;
@{
    ViewBag.Title = "List";
}
<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 mnu = "";
        var windowID;
        $(function () {
            windowID = $.SystemGeneral.getUrlParam("WindowID");
            setleftdiv();
        });

        function setleftdiv() {
            $.getJSON("../../Config/StudentColumnName.json", 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 removeright() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            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');
                }
            });
        };

        function getall() {
            $('#target').find('div').remove();
            
            $.getJSON("../../Config/StudentColumnName.json", 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 getstru_xjzc() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setleftdiv();
            $.getJSON("../../Config/StudentColumnName.json", function (result) {
                $.each(result.stru_xjzc, 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 getstru_sjxg() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setleftdiv();
            $.getJSON("../../Config/StudentColumnName.json", function (result) {
                $.each(result.stru_sjxg, 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 getstru_xnzc() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setleftdiv();
            $.getJSON("../../Config/StudentColumnName.json", function (result) {
                $.each(result.stru_xnzc, 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 getstru_jszc() {
            $('#target').find('div').remove();
            $('#source').find('div').remove();
            setleftdiv();
            $.getJSON("../../Config/StudentColumnName.json", function (result) {
                $.each(result.stru_jszc, 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 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;
        }

        function Student_Infodbf() {
            var Request = new Object();
            Request = GetRequest();
            var Studentselect = top.$("#" + windowID).data("inputData");
            $("[name='QueryParamsDatas']").val(Studentselect.QueryParamsDatas);
            Studentselect.selectedIDs = Request["selectedIDs"];
            $("[name='selectedIDs']").val(Studentselect.selectedIDs);
            var colnames = "";
            var showname = "";
            $('#target').children('div').each(function () {
                colnames = colnames + $(this).attr('id') + ",";
            });
            $('#target').children('div').each(function () {
                showname = showname + $(this).attr('name') + ",";
            });
            $("[name='colnames']").val(colnames);
            $("[name='showname']").val(showname);
            $(document.forms[0]).attr("action", CMS_SystemConfig.VirtualDirectoryPath + "/Students/DbfExport");
            $(document.forms[0]).submit();
        }

        function Student_InfoExcel() {
            var Request = new Object();
            Request = GetRequest();
            var Studentselect = top.$("#" + windowID).data("inputData");
            $("[name='QueryParamsDatas']").val(Studentselect.QueryParamsDatas);
            Studentselect.selectedIDs = Request["selectedIDs"];
            $("[name='selectedIDs']").val(Studentselect.selectedIDs);
            var colnames = "";
            var showname = "";
            $('#target').children('div').each(function () {
                colnames = colnames + $(this).attr('id') + ",";
            });
            $('#target').children('div').each(function () {
                showname = showname + $(this).attr('name') + ",";
            });
            $("[name='colnames']").val(colnames);
            $("[name='showname']").val(showname);
            $(document.forms[0]).attr("action", CMS_SystemConfig.VirtualDirectoryPath + "/Students/InfoExcel");
            $(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("InfoExport")</div>
    </div>
    <form id="formQuery" method="post" action="@Url.Content("~/Students/InfoExcel")">
    @Html.Hidden("QueryParamsDatas")
    @Html.Hidden("selectedIDs")
    @Html.Hidden("colnames")
    @Html.Hidden("showname")
    </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 = "getstru_xjzc()" class = "stru_xjzc" value="新生学籍电子注册上报" /></div>
            <div style = "float:left;margin:0 4px"><input type="button" onclick = "getstru_sjxg()" class = "stru_sjxg" value="在校生数据批量修改上报" /></div>
            <div style = "float:left;margin:0 4px"><input type="button" onclick = "getstru_xnzc()" class = "stru_xnzc" value="在校生学年电子注册上报" /></div>
            <div style = "float:left;margin:0 4px"><input type="button" onclick = "getstru_jszc()" class = "stru_jszc" value="毕业生学历电子注册上报" /></div>
            <div><input style = "margin:0 4px" 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>