layimManager.jsp 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. <%@ page contentType="text/html;charset=UTF-8" %>
  2. <%@ include file="/webpage/include/taglib.jsp"%>
  3. <html>
  4. <head>
  5. <title>群组管理</title>
  6. <meta name="decorator" content="ani"/>
  7. <link href="${ctxStatic}/plugin/layui/dist/css/manager.css" type="text/css" rel="stylesheet"/>
  8. <script type="text/javascript">
  9. $(document).ready(function() {
  10. refreshFriends();
  11. refreshGroups();
  12. });
  13. function refreshGroups() {
  14. jp.get("${ctx}/iim/layGroup/data", function (data) {
  15. var groupTpl = $('#groupTpl').html(); //读取模版
  16. laytpl(groupTpl).render(data, function(render){
  17. $("#my-groups-view").html(render);
  18. });
  19. })
  20. }
  21. function addToGroup(layGroupId){
  22. top.layer.tab({
  23. type: 2,
  24. area: ['800px', '500px'],
  25. title:"添加好友",
  26. name:'friend',
  27. content: "${ctx}/iim/contact/searchUsers" ,
  28. btn: ['确定', '关闭'],
  29. yes: function(index, layero){
  30. var iframeWin = layero.find('iframe')[0].contentWindow; //得到iframe页的窗口对象,执行iframe页的方法:iframeWin.method();
  31. var ids = iframeWin.getSelectedIds();
  32. if(ids == "-1"){
  33. return;
  34. }
  35. jp.go("${ctx}/iim/layGroup/addUser?ids="+ids+"&groupid="+layGroupId);
  36. top.layer.close(index);//关闭对话框。
  37. },
  38. cancel: function(index){
  39. }
  40. });
  41. };
  42. function addGroup(){
  43. jp.openChildDialog("创建群组","${ctx}/iim/layGroup/form","800px", "500px", refreshGroups);
  44. }
  45. function delGroup(id) {
  46. jp.confirm("确认解散该群吗?",function () {
  47. jp.get('${ctx}/iim/layGroup/delete?id='+id, function (data) {
  48. if(data.success){
  49. jp.success("解散成功!");
  50. refreshGroups();
  51. }
  52. })
  53. })
  54. }
  55. function editGroup(id) {
  56. jp.openChildDialog("编辑群组","${ctx}/iim/layGroup/form?id="+id,"800px", "500px", refreshGroups);
  57. }
  58. function viewGroupMember(id) {
  59. jp.openViewDialog("查看群成员","${ctx}/iim/layGroup/member-view?id="+id,"800px", "500px");
  60. }
  61. function editGroupMember(id) {
  62. jp.openViewDialog("查看群成员","${ctx}/iim/layGroup/member-edit?id="+id,"800px", "500px");
  63. }
  64. function outGroup(id) {
  65. jp.confirm("确认退出该群吗?",function () {
  66. jp.get('${ctx}/iim/layGroup/logout?user.id=${fns:getUser().id}&group.id='+id, function (data) {
  67. if(data.success){
  68. jp.success("退出成功!");
  69. refreshGroups();
  70. }
  71. })
  72. })
  73. }
  74. function refreshFriends() {
  75. jp.get("${ctx}/iim/contact/myFriends", function (data) {
  76. var friendTpl = $('#friendTpl').html(); //读取模版
  77. laytpl(friendTpl).render(data, function(render){
  78. $("#my-friends-view").html(render);
  79. });
  80. })
  81. }
  82. function addFriend(){
  83. jp.openUserSelectDialog(true,function (ids) {
  84. jp.get("${ctx}/iim/contact/addFriend?ids="+ids, function (result) {
  85. if(result.success){
  86. refreshFriends()
  87. jp.success(result.msg);
  88. }
  89. })
  90. });
  91. };
  92. function delFriend(id){
  93. jp.get("${ctx}/iim/contact/delFriend?id="+id,function (data) {
  94. if(data.success){
  95. refreshFriends()
  96. jp.success(data.msg);
  97. }
  98. })
  99. }
  100. </script>
  101. </head>
  102. <body class="bg-white">
  103. <div class="tabs-container">
  104. <ul class="nav nav-tabs">
  105. <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true">好友管理:</a>
  106. </li>
  107. <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false">群组管理:</a>
  108. </li>
  109. </ul>
  110. <div class="tab-content">
  111. <div id="tab-1" class="tab-pane fade in active">
  112. <div class="wrapper wrapper-content animated fadeInRight">
  113. <div class="row">
  114. <div class="col-xs-2">
  115. <div class="contact-box">
  116. <a href="#" onclick="addFriend()">
  117. <div class="text-center">
  118. <img alt="image" class="img-circle m-t-xs img-responsive" src="${ctxStatic}/common/images/add_user.jpg">
  119. </div>
  120. <div class="text-center">
  121. <h5>添加好友</h5>
  122. </div>
  123. </a>
  124. </div>
  125. </div>
  126. <div id="my-friends-view"></div>
  127. </div>
  128. </div>
  129. </div>
  130. <div id="tab-2" class="tab-pane fade in">
  131. <div class="wrapper wrapper-content animated fadeInRight">
  132. <div class="row">
  133. <div class="col-xs-4">
  134. <div class="config-card add hand">
  135. <a href="#" onclick="addGroup()">
  136. <span>+</span></a>
  137. </div>
  138. </div>
  139. <div id="my-groups-view"></div>
  140. </div>
  141. </div>
  142. </div>
  143. </div>
  144. <script id="groupTpl" type="text/html">
  145. {{# for(var i = 0, len = d.length; i < len; i++){ }}
  146. <div class="col-xs-4">
  147. <div class='config-card'>
  148. <div class="head bg-primary">
  149. <span class='title ml-4'>{{ d[i].groupname }}</span>
  150. <div class='circle bg-primary'></div>
  151. <div class="line bg-primary"></div>
  152. <div class='priority low bg-primary'>
  153. <img alt="image" class="img-circle m-t-xs img-responsive" src="{{# if(d[i].avatar != ''){ }}{{ d[i].avatar }}{{# }else{ }}${ctxStatic}/common/images/flat-avatar.png {{# } }}" />
  154. </div>
  155. </div>
  156. <div class='content mx-2' style="padding: 10px;">
  157. <div class="card" style="width: 20rem;">
  158. <img class="card-img-top" src="{{ d[i].createBy.photo }}" style="width: 35px;height: auto;" alt="Card image cap">
  159. <h9>{{d[i].createBy.name}}(群主)</h9>
  160. <hr>
  161. <div class="card-block">
  162. <p class="card-text">{{ d[i].remarks }}</p>
  163. </div>
  164. </div>
  165. </div>
  166. <div class="mask">
  167. <div class="opts">
  168. {{# if(d[i].createBy.name == '${fns:getUser().name}'){ }}
  169. <button type="button" onclick="editGroup('{{ d[i].id }}')" class="opt-btn btn btn-primary btn-sm">
  170. <span class='icon-edit mr-2'></span>编辑
  171. </button>
  172. <button type="button" onclick="delGroup('{{ d[i].id }}')" class="opt-btn btn btn-primary btn-sm">
  173. <span class='icon-trash mr-2'></span>删除</button>
  174. <button type="button" onclick="editGroupMember('{{ d[i].id }}')" class="opt-btn btn btn-primary btn-sm">
  175. <span class='icon-trash mr-2'></span>群员</button>
  176. {{# }else{ }}
  177. <button type="button" onclick="outGroup('{{ d[i].id }}')" class="opt-btn btn btn-primary btn-sm">
  178. <span class='icon-trash mr-2'></span>退出</button>
  179. <button type="button" onclick="viewGroupMember('{{ d[i].id }}')" class="opt-btn btn btn-primary btn-sm">
  180. <span class='icon-trash mr-2'></span>群员</button>
  181. {{# } }}
  182. </div>
  183. </div>
  184. </div>
  185. </div>
  186. {{# } }}
  187. </script>
  188. <script id="friendTpl" type="text/html">
  189. {{# for(var i = 0, len = d.length; i < len; i++){ }}
  190. <div class="col-xs-2">
  191. <div class="contact-box">
  192. <a href="#">
  193. <div class="text-center photo">
  194. <img alt="image" class="img-circle m-t-xs img-responsive" src="{{# if(d[i].photo != ''){ }}{{ d[i].photo }}{{# }else{ }}${ctxStatic}/common/images/flat-avatar.png {{# } }}" />
  195. <h5>{{ d[i].name }}</h5>
  196. <div class="mask ">
  197. <div class="opts">
  198. <button class='btn btn-primary btn-sm hand' onclick="delFriend('{{ d[i].id }}')">
  199. <span class='icon icon-file-alt mr-3'></span>删除
  200. </button>
  201. </div>
  202. </div>
  203. </div>
  204. </a>
  205. </div>
  206. </div>
  207. {{# } }}
  208. </script>
  209. </body>
  210. </html>