zoukankan      html  css  js  c++  java
  • easyui DatagrId 的实例讲解

    下面是代码实现

    @{
        ViewBag.Title = "人员查找";
        ViewBag.LeftWidth = "200px";
        ViewBag.MiddleWidth = "200px";
    }
    <html>
    <head>
        <link href="../../../Script/easyui/themes/bootstrap/easyui.css" rel="stylesheet" type="text/css" />
        <link href="../../../Script/easyui/themes/icon.css" rel="stylesheet" type="text/css" />
        <link href="../../../Content/themes/base/Common/common.css" rel="stylesheet" type="text/css" />
        <script src="../../../Script/easyui/jquery-1.8.3.min.js" type="text/javascript"></script>
        <script src="../../../Script/Common/json2.js" type="text/javascript"></script>
        <script src="../../../Script/easyui/jquery.easyui.min.js" type="text/javascript"></script>
        <script src="../../../Script/easyui/easyui-lang-zh_CN.js" type="text/javascript"></script>
        <script src="../../../Script/Common/Toolbar.js" type="text/javascript"></script>
        <script src="../../../Script/easyui/plugins/JValidator.js" type="text/javascript"></script>
        <script src="../../../Script/Common/Common.js" type="text/javascript"></script>
    </head>
    <body class="easyui-layout">
        <div region="north"  data-options="border:false" style="height: 50px;" >
     
      
                           <div   style=" margin-top:15px; margin-left:15px"    >
                        <a id="btn_byforDepmen"  onclick="searchByforDep()" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'">
                            按部门设置</a>
               
                        <a id="btn_byforRose" onclick="searchByforRose()"  href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'">
                            按角色设置</a>
                            </div>
                  
                   
             
          
        </div>
        <div region="west" title="部门树" id="leftDepTree"  split="true"  style=" 230px;">
            <div style="border: 1px;">
                <ul id="Deptree" class="easyui-tree">
                </ul>
            </div>
        </div>
        <div region="center">

           <div id="cc" class="easyui-layout" data-options="fit:true,border:false">
           <div region="center" title="选择人员">
            <table id="SearchEmployeeList" class="easyui-datagrid" data-options="fit:true,border:true">
            </table>
            </div>
            </div>

        </div>

        <div region="east"  title="选中人员" split="true" style=" 260px;">
            <table id="EmployeeList" class="easyui-datagrid"   fitColumns="true" data-options="fit:true,border:false"
           
            checkOnSelect:"true" singleselect="false">
                <thead>
                    <tr>
                        <th field="ck" width="50" checkbox="true">
                         
                        </th>
                       <th field="UserId"  hidden= "true"  width="50">
                    
                       </th>
                        <th field="RealName"  width="50">
                           姓名
                        </th>
                    </tr>
                </thead>
            </table>
        </div>

        <div region="south" split="true" style="margin-bottom: 15px; margin-right: auto;
            margin-left: auto; text-align: center">

            <table>

                <tr>
                    <td>
                        <a id="btn_query" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save'">确定</a>
                    </td>
                    <td>
                        <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'">
                            清空</a>
                    </td>
                    <td>
                        <a id="btn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'">
                            取消</a>
                    </td>
                </tr>


            </table>
        </div>
    </body>
    </html>
    <script type="text/javascript">
        //页面加载按部门搜索部门树列表
        var MySearchEmployee = {
            //加载左侧部门树
            onloadDepTree: function (flag) { //部门树方法
                $('#Deptree').tree({
                    checkbox: false,
                    url: '../SearchEmployee/GetOrganizationList',
                    onClick: function (node) {
                        //flag代表着开关, D表示加载部门信息
                        if (flag == "D") {
                            MySearchEmployee.EmployeeListByforOrg(node.EX1, node.id); //传递参数绑定gridList
                        }
                        else {
                            MySearchEmployee.onloadRoleTree(node.id); //加载员工数
                        }
                    }
                });

                $('#cc').layout('remove', 'west');
            },
            //加载左侧岗位上
            onloadRoleTree: function (orgid) {
                $('#roleTree').tree({
                    checkbox: false,
                    url: '../SearchEmployee/GetRoseList?orgID=' + orgid,
                    onClick: function (node) {
                        MySearchEmployee.onloadSeachEmpListByforRole(node.id); //加载人员列表
                    }
                });
            },
            //清空原来的数据
            removeEmpListTree: function () {//岗位树
                MySearchEmployee.onloadDepTree("R");
                //隐藏部门加载人员列表
                var region = 'west';
                var options = {
                    region: region
                };
                options.width = 260;
                options.split = true;
                options.title = "岗位树";
                options.id = "leftroleTree";
                $('#cc').layout('add', options);
                $("#leftroleTree").append("  <div style="border: 1px;"> <ul id="roleTree" class="easyui-tree"> </ul> </div> ");
                var data = $('#SearchEmployeeList').datagrid('getData'); //清空下searList
                for (var i = (data.total - 1); i >= 0; i--) {
                    $('#SearchEmployeeList').datagrid('deleteRow', i);
                }
                $('#EmployeeList').datagrid('clearChecked');
            },
            //点击部门按钮
            checkDepTree: function () {

                //去掉岗位树
                $('#cc').layout('remove', 'west');
                var data = $('#SearchEmployeeList').datagrid('getData'); //清空下searList
                for (var i = (data.total - 1); i >= 0; i--) {
                    $('#SearchEmployeeList').datagrid('deleteRow', i);
                }
                $('#EmployeeList').datagrid('clearChecked');
                MySearchEmployee.onloadDepTree("D");


           
            },

            onloadSeachEmpList: function (UserId, RealName) {//单击选中checkbox 确定最终的显示人
                var contains = false;
                var data = $('#EmployeeList').datagrid('getData');
                if (data.total == 0) {
                    $('#EmployeeList').datagrid('insertRow', {
                        index: 1, // index start with 0
                        row: { "UserId": UserId, "RealName": RealName }
                    });
                }
                else {
                    for (var i = 0; i < data.total; i++) {
                        if (data.rows[i].UserId == UserId) {
                            contains = true;
                            break;
                        }
                    }
                    if (!contains) {
                        $('#EmployeeList').datagrid('insertRow', {
                            index: 1, // index start with 0
                            row: { "UserId": UserId, "RealName": RealName }
                        });
                    }
                }
                $('#EmployeeList').datagrid('checkAll'); //默认全部选中
            },
            EmployeeListByforOrg: function (Category, OrganizationId) {//根据部门的ID和种类查询出本部门下所有的人员
                var param = {
                    "Category": Category, "OrganizationId": OrganizationId

                };
                $("#SearchEmployeeList").datagrid({
                    url: '../SearchEmployee/GetEmployeeByForOrg',
                    nowrap: false, //是否换行,True 就会把数据显示在一行里
                    striped: true, //True 奇偶行使用不同背景色
                    fitColumns: true, //True 就会自动扩大或缩小列的尺寸以适应表格的宽度并且防止水平滚动。          
                    queryParams: param,
                    onSelect: function (rowIndex, rowData) //选中时绑定人员表
                    {
                        MySearchEmployee.onloadSeachEmpList(rowData.UserId, rowData.RealName);
                    },
                    onUnselect: function (rowIndex, rowData) {  //取消选中是的时候同时也要删

                        MySearchEmployee.UnloadEmployeeList(rowData.UserId);
                    },

                    onSelectAll: function (rows) //全部选中
                    {
                        MySearchEmployee.onSelectAllByforSearchEmployeeList(rows); //全部选中
                    },
                    onUnselectAll: function (rows) {

                        MySearchEmployee.onUnselectAllByforSearchEmployeeList(rows); //全部不选中
                    },
                    onLoadSuccess: function (data) {

                        MySearchEmployee.selectedByforSeacherEmployeeList(data);
                    },
                    columns: [[
                      { field: 'ck', checkbox: 'true', 30 },
                      { field: 'UserId', 30, hidden: true },
                      { field: 'RealName', title: '姓名', 300 }
               ]]
                });
            },
            //根据角色树加载List列表
            onloadSeachEmpListByforRole: function (roleID) {

                var param = {
                    "roleID": roleID
                };
                $("#SearchEmployeeList").datagrid({
                    url: '../SearchEmployee/GetUserByforRole',
                    nowrap: false, //是否换行,True 就会把数据显示在一行里
                    striped: true, //True 奇偶行使用不同背景色
                    fitColumns: true, //True 就会自动扩大或缩小列的尺寸以适应表格的宽度并且防止水平滚动。          
                    queryParams: param,
                    onSelect: function (rowIndex, rowData) //选中时绑定人员表
                    {
                        MySearchEmployee.onloadSeachEmpList(rowData.UserId, rowData.RealName);

                    },
                    onUnselect: function (rowIndex, rowData) {  //取消选中是的时候同时也要删

                        MySearchEmployee.UnloadEmployeeList(rowData.UserId);
                    },

                    onSelectAll: function (rows) //全部选中
                    {
                        MySearchEmployee.onSelectAllByforSearchEmployeeList(rows); //全部选中
                    },
                    onUnselectAll: function (rows) {

                        MySearchEmployee.onUnselectAllByforSearchEmployeeList(rows); //全部不选中
                    },
                    onLoadSuccess: function (data) {

                        MySearchEmployee.selectedByforSeacherEmployeeList(data);
                    },
                    columns: [[
                      { field: 'ck', checkbox: 'true', 30 },
                      { field: 'UserId', 30, hidden: true },
                      { field: 'RealName', title: '姓名', 300 }
               ]]
                });
            },
            UnloadEmployeeList: function (UserId) { //取消的时候删除行
                //根据userID查找这一行的索引
                var data = $('#EmployeeList').datagrid('getData');

                for (var i = 0; i < data.total; i++) {

                    if (data.rows[i].UserId == UserId) {
                        $('#EmployeeList').datagrid('deleteRow', i);
                    }
                }
            },
            unselectRowEmployeeList: function (UserId) {  //去除已经选择上的人员,并且在SearchEmployeeList把打钩去掉
                var data = $('#SearchEmployeeList').datagrid('getData');
                for (var i = 0; i < data.total; i++) {
                    if (data.rows[i].UserId == UserId) {
                        $('#SearchEmployeeList').datagrid('unselectRow', i);
                    }
                }
            },
            onSelectAllByforSearchEmployeeList: function (rows) { //SearchEmployeeList 全选

                //那么EmployeeList 就要显示选中的行
                //选清空一下
                //  $('#EmployeeList').datagrid('clearChecked');
                //然后在增加
                for (var i = 0; i < rows.length; i++) {
                    MySearchEmployee.onloadSeachEmpList(rows[i].UserId, rows[i].RealName);
                }
            },
            onUnselectAllByforSearchEmployeeList: function (rows) { //SearchEmployeeList 全不选

                var data = $('#EmployeeList').datagrid('getData'); //获取当前的EmloyeeList所有的数据
                //删除EmployeeList
                for (var i = 0; i < rows.length; i++) {
                    for (var k = 0; k < data.total; k++) {
                        if (rows[i].UserId == data.rows[k].UserId) {
                            $('#EmployeeList').datagrid('deleteRow', k);
                        }
                    }
                }
            },
            onloadForEmployeeList: function () {

                $("#EmployeeList").datagrid({
                    onUnselect: function (rowIndex, rowData) {
                        $('#EmployeeList').datagrid('deleteRow', rowIndex); //删除当前行

                        MySearchEmployee.unselectRowEmployeeList(rowData.UserId); //去除SearchEmployeeList打钩数据
                    },
                    onLoadSuccess: function (data) { //接收data

                        //全局变量

                    },
                    onUnselectAll: function (rows) {
                        MySearchEmployee.deleteAllforEmployeeList(rows); //删除所有的列表人员
                    }
                });

            },
            deleteAllforEmployeeList: function (rows) { //清空选中的列表

                var data = $('#SearchEmployeeList').datagrid('getData'); //获取当前的EmloyeeList所有的数据

                var arryList = [];

                for (var i = (rows.length - 1); i >= 0; i--) {
                    for (var k = 0; k < data.total; k++) {
                        if (data.rows[k].UserId == rows[i].UserId) {
                            arryList.push(k);
                        }
                    }
                    $('#EmployeeList').datagrid('deleteRow', i); //删除list列表             
                }


                for (var i = 0; i < arryList.length; i++) {
                    $('#SearchEmployeeList').datagrid('unselectRow', arryList[i]);
                }
            },
            selectedByforSeacherEmployeeList: function (Depdata) { //执行回调打钩
                var Empdata = $('#EmployeeList').datagrid('getData');
                var arryList = []; //存放索引的值
                for (var i = 0; i < Depdata.total; i++) {
                    for (var k = 0; k < Empdata.total; k++) {
                        if (Depdata.rows[i].UserId == Empdata.rows[k].UserId) {
                            arryList.push(i);
                        }
                    }
                }
                for (var i = 0; i < arryList.length; i++) {
                    $('#SearchEmployeeList').datagrid('checkRow', arryList[i]); // checkRow  selectRow
                }
            },
            retureEmpListData: function () { //返回提交EmpList表中的数据

                var Empdata = $('#EmployeeList').datagrid('getData');
                return Empdata.rows;
            }
        };
        //单击部门
        function searchByforDep() {  //按部门搜索
            MySearchEmployee.checkDepTree();

        }
        //单击按角色查询
        function searchByforRose() {
            MySearchEmployee.removeEmpListTree(); //加载角色权限树
        }
        $("#btn_query").click(function () {  //点击确定回传数据
            // MySearchEmployee.retureEmpListData();
        });

        //页面初始化
        $(function () {
            MySearchEmployee.onloadDepTree("D");
            MySearchEmployee.onloadForEmployeeList(); //页面出
        });
    </script>

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Collections;
    using System.Web.Mvc;
    using System.Web;
    using System.Data;
    using GWork.Models;
    using Newtonsoft.Json;
    using GWork.DataAccess;
    using GWork.Business;
    using GWork.IBusiness;
    using SysManager.Models;
    using SysManager.Common.Utilities;
    using Newtonsoft.Json.Converters;
    namespace GWork.Controllers.OpenWindows.SearchEmployee
    {
        public class SearchEmployeeController : Controller
        {

            private SYS_User userinfo = new SYS_User();
            private SYS_Organization organizationinfo = new SYS_Organization(); //权限表中的组织部门
            private SysManager.IBusiness.IOrganizationBLL organizationibll = SysManager.Business.BusinessFactory.Instance.CreateOrganization();//部门工厂
            private SysManager.IBusiness.IRolesBLL rolesbll = SysManager.Business.BusinessFactory.Instance.CreateRoles();//角色工厂
            private SysManager.IBusiness.IUserBLL userbll = SysManager.Business.BusinessFactory.Instance.CreateUser();//  获取员工用户方法


            public ActionResult SearchEmployeeList()
            {
                return View();
            }

            #region 获取部门列表树集合
            /// <summary>
            /// 获取部门列表树集合
            /// </summary>
            /// <returns></returns>
            public string GetOrganizationList()
            {

                System.Collections.IList orgainList = organizationibll.GetList();//获取部门方法
                IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
                timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
                List<SYS_Organization> listtree = SysManager.Common.Utilities.IListHelper.IListToList<SYS_Organization>(orgainList);//将IList 转化成List
                SYS_Organization orgobj = listtree.Find(org => org.ParentId == "0");//构造顶级节点//(数据库中用的是O)
                LEFTTREE lefttree = new LEFTTREE();
                lefttree.ID = orgobj.OrganizationId; //树节点
                lefttree.TEXT = orgobj.FullName;   //公司名称
                lefttree.CHILDREN = new List<LEFTTREE>();  //树子节点
                lefttree.EX1 = orgobj.Category;// (额外条件种类)

                TreeDiGui(lefttree.ID, lefttree, listtree); //递归用法

                return "[" + JsonConvert.SerializeObject(lefttree).Replace("TEXT", "text").Replace("ID", "id").Replace("CHILDREN", "children") + "]";
            }

            #region 查找树的子节点
            /// <summary>
            /// 查找树的子节点
            /// </summary>
            /// <param name="sb"></param>
            /// <param name="ParentId"></param>
            /// <returns></returns>
            public LEFTTREE TreeDiGui(string ParentId, LEFTTREE LEFTTREE, IEnumerable<SYS_Organization> ALLTREE)
            {

                //
                IEnumerable<SYS_Organization> FindTree = ALLTREE.Where(new Func<SYS_Organization, bool>(d => d.ParentId == ParentId));
                foreach (SYS_Organization item in FindTree)
                {
                    LEFTTREE ChildTree = new LEFTTREE();
                    ChildTree.ID = item.OrganizationId;
                    ChildTree.TEXT = item.FullName;
                    ChildTree.CHILDREN = new List<LEFTTREE>();
                    ChildTree.EX1 = item.Category;//种类
                    LEFTTREE.CHILDREN.Add(ChildTree);
                    TreeDiGui(ChildTree.ID, ChildTree, ALLTREE);
                }
                return LEFTTREE;
            }
            #endregion


            #region 根据部门查找该部门下所有的人
            /// <summary>
            /// 根据组织部门下的人员
            /// </summary>
            /// <returns></returns>
            public string GetEmployeeByForOrg()
            {
                try
                {
                    string Category = Request["Category"].ToString(); //获取种类
                    string OrganizationId = Request["OrganizationId"].ToString();//获取部门ID
                    System.Collections.IList userIList = userbll.GetDataTableByOrganizationId(Category, OrganizationId);//根据种类和orgid查询出该部门下所有的人员
                    IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
                    timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
                    List<SYS_User> userList = SysManager.Common.Utilities.IListHelper.IListToList<SYS_User>(userIList);//把得到IList转化成List格式
                    return JsonConvert.SerializeObject(userList, timeConverter);
                }
                catch (Exception ex)
                {
                    throw (ex);

                }
            }

            #endregion
            #endregion


            #region  获取岗位列表树集合
            /// <summary>
            /// 获取角色列表集合
            /// </summary>
            /// <returns></returns>
            public string GetRoseList() //string
            {
                string orgID = Request["orgID"].ToString();//获取orgID

                System.Collections.IList roseList = rolesbll.GetList(orgID);
                IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
                timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
                List<SYS_Roles> listtree = SysManager.Common.Utilities.IListHelper.IListToList<SYS_Roles>(roseList);//将IList 转化成List
                List<LEFTTREE> List = new List<LEFTTREE>();
                foreach (SYS_Roles item in listtree)
                {
                    LEFTTREE lefttree = new LEFTTREE();
                    lefttree.ID = item.RoleId; //树节点
                    lefttree.TEXT = item.FullName;   //公司名称
                    lefttree.CHILDREN = new List<LEFTTREE>();  //树子节点
                    List.Add(lefttree);
                }
                return JsonConvert.SerializeObject(List, timeConverter).Replace("TEXT", "text").Replace("ID", "id").Replace("CHILDREN", "children") ;
         
           
            }
            #endregion

            #region 根据岗位角色条件查询人
            /// <summary>
            ///根据角色条件查询
            /// </summary>
            /// <returns></returns>
            public string GetUserByforRole()
            {
                try
                {
                    string roleID = Request["roleID"].ToString();

                    string strWhere = " and roleid=" + "'" + roleID + "'";
                    System.Collections.IList userList = userbll.GetUserListBywhere(strWhere);

                    IsoDateTimeConverter timeConverter = new IsoDateTimeConverter();
                    timeConverter.DateTimeFormat = "yyyy'-'MM'-'dd' 'HH':'mm':'ss";
                    List<SYS_User> list = SysManager.Common.Utilities.IListHelper.IListToList<SYS_User>(userList);//把得到IList转化成List格式
                    return JsonConvert.SerializeObject(userList, timeConverter);
                }
                catch (Exception ex)
                {
                    throw (ex);

                }


            }

            #endregion


        }
    }

    --

     

  • 相关阅读:
    软件实现的施密特触发器
    激励
    正式搬家,到博客园
    IAR编译器的常见问题
    记正式开始工作
    调度器的介绍
    atmega8 例程:AD中断方式采集
    【IAR警告】Warning[Pa082]: undefined behavior: the order of volatile accesses is undefined
    AD转换器的参数介绍
    影响LIMIT子句使用的一个mysql配置项
  • 原文地址:https://www.cnblogs.com/dullbaby/p/3571645.html
Copyright © 2011-2022 走看看