AllotMember.cshtml 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. @{
  2. ViewBag.Title = "用户组成员";
  3. Layout = "~/Views/Shared/_LayoutIndex.cshtml";
  4. }
  5. <script>
  6. var userGroupId = request('userGroupId');
  7. $(function () {
  8. InitialPage();
  9. GetMember();
  10. GetTree();
  11. });
  12. //初始化页面
  13. function InitialPage() {
  14. //layout布局
  15. $('#layout').layout({
  16. applyDemoStyles: true,
  17. west__size: 160,
  18. spacing_open: 0,
  19. onresize: function () {
  20. $(window).resize()
  21. }
  22. });
  23. $(".center-Panel").height($(window).height() - 40)
  24. }
  25. //加载树
  26. var departmentid = "card-box";
  27. function GetTree() {
  28. var item = {
  29. height: $(window).height()-1,
  30. url: "../../AuthorizeManage/PermissionUserGroup/GetDepartmentTreeJson?userGroupId=" + userGroupId,
  31. onnodeclick: function (item) {
  32. Loading(true);
  33. window.setTimeout(function () {
  34. if (item.parentnodes == "0") {
  35. $(".card-box").show();
  36. departmentid = "card-box";
  37. } else {
  38. $(".card-box").hide();
  39. $('.' + item.id).show();
  40. departmentid = item.id;
  41. }
  42. Loading(false);
  43. }, 200);
  44. }
  45. };
  46. //初始化
  47. $("#itemTree").treeview(item);
  48. }
  49. //加载成员
  50. function GetMember() {
  51. $.ajax({
  52. url: "../../AuthorizeManage/PermissionUserGroup/GetUserListJson?userGroupId=" + userGroupId,
  53. type: "get",
  54. dataType: "json",
  55. async: false,
  56. success: function (data) {
  57. var _html = "";
  58. $.each(data, function (i) {
  59. var row = data[i];
  60. var imgName = "UserCard01.png";
  61. if (row.gender == 1) {
  62. imgName = "UserCard02.png";
  63. }
  64. var active = "";
  65. if (row.ischeck == 1) {
  66. active = "active";
  67. }
  68. _html += '<div class="card-box ' + row.departmentid + ' ' + active + '">';
  69. _html += ' <div class="card-box-img">';
  70. _html += ' <img src="/Content/images/' + imgName + '" />';
  71. _html += ' </div>';
  72. _html += ' <div id="' + row.userid + '" class="card-box-content">';
  73. _html += ' <p>账户:' + row.account + '</p>';
  74. _html += ' <p>姓名:' + row.realname + '</p>';
  75. _html += ' <p>部门:' + row.departmentname + '</p>';
  76. _html += ' </div><i></i>';
  77. _html += '</div>';
  78. });
  79. $(".gridPanel").html(_html);
  80. $(".card-box").click(function () {
  81. if (!$(this).hasClass("active")) {
  82. $(this).addClass("active")
  83. } else {
  84. $(this).removeClass("active")
  85. }
  86. })
  87. Loading(false);
  88. }, beforeSend: function () {
  89. Loading(true);
  90. }
  91. });
  92. //模糊查询用户(注:这个方法是理由jquery查询)
  93. $("#txt_TreeKeyword").keyup(function () {
  94. var value = $(this).val();
  95. if (value != "") {
  96. window.setTimeout(function () {
  97. $("." + departmentid)
  98. .hide()
  99. .filter(":contains('" + (value) + "')")
  100. .show();
  101. }, 200);
  102. } else {
  103. $("." + departmentid).show();
  104. }
  105. }).keyup();
  106. }
  107. //保存表单
  108. function AcceptClick() {
  109. var userIds = [];
  110. $('.gridPanel .active .card-box-content').each(function () {
  111. userIds.push($(this).attr('id'));
  112. });
  113. var postData = $("#form1").GetWebControls();
  114. postData["userGroupId"] = userGroupId;
  115. postData["userIds"] = String(userIds)
  116. $.SaveForm({
  117. url: "../../AuthorizeManage/PermissionUserGroup/SaveMember",
  118. param: postData,
  119. loading: "正在保存用户组成员...",
  120. success: function () {
  121. $.currentIframe().$("#gridTable").trigger("reloadGrid");
  122. }
  123. })
  124. }
  125. </script>
  126. <div class="ui-layout" id="layout" style="height: 100%; width: 100%;">
  127. <div class="ui-layout-west">
  128. <div class="west-Panel" style="margin: 0px; border-top: none; border-left: none; border-bottom: none;">
  129. <div id="itemTree"></div>
  130. </div>
  131. </div>
  132. <div class="ui-layout-center">
  133. <div class="treesearch">
  134. <input id="txt_TreeKeyword" type="text" class="form-control" style="border-top: none;" placeholder="请输入要查询关键字" />
  135. <span id="btn_TreeSearch" class="input-query" title="Search"><i class="fa fa-search"></i></span>
  136. </div>
  137. <div class="center-Panel" style="margin: 0px; border-right: none; border-left: none; border-bottom: none; background-color: #fff; overflow: auto; padding-bottom: 10px;">
  138. <div class="gridPanel">
  139. </div>
  140. </div>
  141. </div>
  142. </div>