add.html 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. <!DOCTYPE html>
  2. <html lang="zh" xmlns:th="http://www.thymeleaf.org" >
  3. <meta charset="utf-8">
  4. <head th:include="include :: header"></head>
  5. <body class="white-bg">
  6. <div class="wrapper wrapper-content animated fadeInRight ibox-content">
  7. <form class="form-horizontal m" id="form-user-add">
  8. <input name="deptId" type="hidden" id="treeId"/>
  9. <div class="form-group">
  10. <label class="col-sm-3 control-label ">登录名称:</label>
  11. <div class="col-sm-8">
  12. <input class="form-control" type="text" id="loginName" name="loginName"/>
  13. </div>
  14. </div>
  15. <div class="form-group">
  16. <label class="col-sm-3 control-label">部门名称:</label>
  17. <div class="col-sm-8">
  18. <input class="form-control" type="text" name="deptName" onclick="selectDeptTree()" readonly="true" id="treeName">
  19. </div>
  20. </div>
  21. <div class="form-group">
  22. <label class="col-sm-3 control-label">用户名称:</label>
  23. <div class="col-sm-8">
  24. <input class="form-control" type="text" name="userName" id="userName">
  25. </div>
  26. </div>
  27. <div class="form-group">
  28. <label class="col-sm-3 control-label">密码:</label>
  29. <div class="col-sm-8">
  30. <input class="form-control" type="password" name="password" id="password" th:value="${@config.getKey('sys.user.initPassword')}">
  31. </div>
  32. </div>
  33. <div class="form-group">
  34. <label class="col-sm-3 control-label">邮箱:</label>
  35. <div class="col-sm-8">
  36. <input class="form-control" type="text" name="email" id="email">
  37. </div>
  38. </div>
  39. <div class="form-group">
  40. <label class="col-sm-3 control-label">手机:</label>
  41. <div class="col-sm-8">
  42. <input class="form-control" type="text" name="phonenumber" id="phonenumber">
  43. </div>
  44. </div>
  45. <div class="form-group">
  46. <label class="col-sm-3 control-label">性别:</label>
  47. <div class="col-sm-8">
  48. <select id="sex" class="form-control m-b" th:with="type=${@dict.getType('sys_user_sex')}">
  49. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
  50. </select>
  51. </div>
  52. </div>
  53. <div class="form-group">
  54. <label class="col-sm-3 control-label">状态:</label>
  55. <div class="col-sm-8">
  56. <div class="onoffswitch">
  57. <input type="checkbox" th:checked="true" class="onoffswitch-checkbox" id="status" name="status">
  58. <label class="onoffswitch-label" for="status">
  59. <span class="onoffswitch-inner"></span>
  60. <span class="onoffswitch-switch"></span>
  61. </label>
  62. </div>
  63. </div>
  64. </div>
  65. <div class="form-group">
  66. <label class="col-sm-3 control-label">岗位:</label>
  67. <div class="col-sm-8">
  68. <select id="post" name="post" class="form-control select2-hidden-accessible" multiple="">
  69. <option th:each="post:${posts}" th:value="${post.postId}" th:text="${post.postName}" th:disabled="${post.status == '1'}"></option>
  70. </select>
  71. </div>
  72. </div>
  73. <div class="form-group">
  74. <label class="col-sm-3 control-label">角色:</label>
  75. <div class="col-sm-8">
  76. <label th:each="role:${roles}" class="check-box">
  77. <input name="role" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}" th:disabled="${role.status == '1'}">
  78. </label>
  79. </div>
  80. </div>
  81. </form>
  82. </div>
  83. <div th:include="include::footer"></div>
  84. <script th:src="@{/ajax/libs/select/select2.js}"></script>
  85. <script>
  86. $("#form-user-add").validate({
  87. rules:{
  88. loginName:{
  89. required:true,
  90. minlength: 2,
  91. maxlength: 20,
  92. remote: {
  93. url: ctx + "system/user/checkLoginNameUnique",
  94. type: "post",
  95. dataType: "json",
  96. data: {
  97. name : function() {
  98. return $.common.trim($("#loginName").val());
  99. }
  100. },
  101. dataFilter: function(data, type) {
  102. return $.validate.unique(data);
  103. }
  104. }
  105. },
  106. userName:{
  107. required:true,
  108. },
  109. deptName:{
  110. required:true,
  111. },
  112. password:{
  113. required:true,
  114. minlength: 5,
  115. maxlength: 20
  116. },
  117. email:{
  118. required:true,
  119. email:true,
  120. remote: {
  121. url: ctx + "system/user/checkEmailUnique",
  122. type: "post",
  123. dataType: "json",
  124. data: {
  125. name: function () {
  126. return $.common.trim($("#email").val());
  127. }
  128. },
  129. dataFilter: function (data, type) {
  130. return $.validate.unique(data);
  131. }
  132. }
  133. },
  134. phonenumber:{
  135. required:true,
  136. isPhone:true,
  137. remote: {
  138. url: ctx + "system/user/checkPhoneUnique",
  139. type: "post",
  140. dataType: "json",
  141. data: {
  142. name: function () {
  143. return $.common.trim($("#phonenumber").val());
  144. }
  145. },
  146. dataFilter: function (data, type) {
  147. return $.validate.unique(data);
  148. }
  149. }
  150. },
  151. },
  152. messages: {
  153. "loginName": {
  154. remote: "用户已经存在"
  155. },
  156. "email": {
  157. remote: "Email已经存在"
  158. },
  159. "phonenumber":{
  160. remote: "手机号码已经存在"
  161. }
  162. }
  163. });
  164. function submitHandler() {
  165. if ($.validate.form("#form-user-add")) {
  166. add();
  167. }
  168. }
  169. function add() {
  170. var userId = $("input[name='userId']").val();
  171. var deptId = $("input[name='deptId']").val();
  172. var loginName = $("input[name='loginName']").val();
  173. var userName = $("input[name='userName']").val();
  174. var password = $("input[name='password']").val();
  175. var email = $("input[name='email']").val();
  176. var phonenumber = $("input[name='phonenumber']").val();
  177. var sex = $("#sex option:selected").val();
  178. var status = $("input[name='status']").is(':checked') == true ? 0 : 1;
  179. var roleIds = $.form.selectCheckeds("role");
  180. var postIds = $.form.selectSelects("post");
  181. $.ajax({
  182. cache : true,
  183. type : "POST",
  184. url : ctx + "system/user/add",
  185. data : {
  186. "userId": userId,
  187. "deptId": deptId,
  188. "loginName": loginName,
  189. "userName": userName,
  190. "password": password,
  191. "email": email,
  192. "phonenumber": phonenumber,
  193. "sex": sex,
  194. "status": status,
  195. "roleIds": roleIds,
  196. "postIds": postIds
  197. },
  198. async : false,
  199. error : function(request) {
  200. $.modal.alertError("系统错误");
  201. },
  202. success : function(data) {
  203. $.operate.saveSuccess(data);
  204. }
  205. });
  206. }
  207. /*用户管理-新增-选择部门树*/
  208. function selectDeptTree() {
  209. var treeId = $("#treeId").val();
  210. var deptId = $.common.isEmpty(treeId) ? "100" : $("#treeId").val();
  211. var url = ctx + "system/dept/selectDeptTree/" + deptId;
  212. var options = {
  213. title: '选择部门',
  214. width: "380",
  215. height: "380",
  216. url: ctx + "system/dept/selectDeptTree/" + deptId,
  217. callBack: doSubmit
  218. };
  219. $.modal.openOptions(options);
  220. }
  221. function doSubmit(index, layero){
  222. var tree = layero.find("iframe")[0].contentWindow.$._tree;
  223. if ($.tree.notAllowParents(tree)) {
  224. var body = layer.getChildFrame('body', index);
  225. $("#treeId").val(body.find('#treeId').val());
  226. $("#treeName").val(body.find('#treeName').val());
  227. layer.close(index);
  228. }
  229. }
  230. </script>
  231. </body>
  232. </html>