edit.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390
  1. <!DOCTYPE html>
  2. <html lang="zh" xmlns:th="http://www.thymeleaf.org" >
  3. <head>
  4. <th:block th:include="include :: header('修改弹框配置')" />
  5. <th:block th:include="include :: datetimepicker-css" />
  6. <th:block th:include="include :: bootstrap-select-css" />
  7. </head>
  8. <body class="white-bg">
  9. <div class="wrapper wrapper-content animated fadeInRight ibox-content">
  10. <form class="form-horizontal m" id="form-configuration-edit" th:object="${alertConfiguration}">
  11. <input name="alertId" th:field="*{alertId}" type="hidden">
  12. <div class="form-group">
  13. <label class="col-sm-3 control-label">弹框内容:</label>
  14. <div class="col-sm-8">
  15. <textarea id="alertContent" name="alertContent" class="form-control">[[*{alertContent}]]</textarea>
  16. </div>
  17. </div>
  18. <div class="form-group">
  19. <label class="col-sm-3 control-label">弹框开始时间:</label>
  20. <div class="col-sm-8">
  21. <div class="input-group date">
  22. <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
  23. <input id="alertStartTime" name="alertStartTime" th:value="${#dates.format(alertConfiguration.alertStartTime, 'yyyy-MM-dd hh:mm')}" class="form-control" placeholder="yyyy-MM-dd hh:mm" type="text">
  24. </div>
  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. <div class="input-group date">
  31. <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
  32. <input id="alertEndTime" name="alertEndTime" th:value="${#dates.format(alertConfiguration.alertEndTime, 'yyyy-MM-dd hh:mm')}" class="form-control" placeholder="yyyy-MM-dd hh:mm" type="text">
  33. </div>
  34. </div>
  35. </div>
  36. <div class="form-group">
  37. <label class="col-sm-3 control-label">弹框每日可弹次数:</label>
  38. <div class="col-sm-8">
  39. <input name="alertNum" th:field="*{alertNum}" class="form-control" type="text">
  40. </div>
  41. </div>
  42. <div class="form-group">
  43. <label class="col-sm-3 control-label">用户类型:</label>
  44. <div class="col-sm-8">
  45. <select title="请选择" id="userType" name="userType" class="form-control m-b selectpicker" th:with="type=${@dict.getType('sys_lantern_permission')}" multiple>
  46. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{userType}"></option>
  47. </select>
  48. </div>
  49. </div>
  50. <div class="form-group">
  51. <input name="alertId" th:field="*{alertId}" style="display: none;">
  52. <input name="salesLevel" th:field="*{salesLevel}" style="display: none;">
  53. <input name="orgCode" th:field="*{orgCode}" style="display: none;">
  54. <input name="orgName" th:field="*{orgName}" style="display: none;">
  55. <input name="userTypeStr" th:field="*{userType}" style="display: none;">
  56. </div>
  57. <div class="form-group">
  58. <label class="col-sm-3 control-label">部门类型:</label>
  59. <div class="col-sm-3">
  60. <select title="请选择公司" id="deptType1" class="form-control m-b selectpicker">
  61. </select>
  62. </div>
  63. <div class="col-sm-3">
  64. <select title="请选择大区" id="deptType2" class="form-control m-b selectpicker">
  65. </select>
  66. </div>
  67. <div class="col-sm-3">
  68. <select title="请选择销售部" id="deptType3" class="form-control m-b selectpicker">
  69. </select>
  70. </div>
  71. </div>
  72. <div class="form-group">
  73. <label class="col-sm-3 control-label"></label>
  74. <div class="col-sm-3">
  75. <a class="btn btn-primary btn-rounded btn-sm" id="clearSelect">清空部门类型</a>
  76. </div>
  77. </div>
  78. <!-- <div class="form-group">
  79. <label class="col-sm-3 control-label">是否启动:</label>
  80. <div class="col-sm-8">
  81. <div class="radio-box" th:each="dict : ${@dict.getType('sys_ziti_show_hide')}">
  82. <input type="radio" th:id="${dict.dictCode}" name="alertStatus" th:value="${dict.dictValue}"
  83. th:field="*{alertStatus}">
  84. <label th:for="${dict.dictCode}" th:text="${dict.dictLabel}"></label>
  85. </div>
  86. </div>
  87. </div>-->
  88. </form>
  89. </div>
  90. <th:block th:include="include :: footer" />
  91. <th:block th:include="include :: datetimepicker-js" />
  92. <th:block th:include="include :: bootstrap-select-js" />
  93. <script type="text/javascript">
  94. var prefix = ctx + "system/configuration";
  95. // var getCompanyListPrefix = "http://localhost:10001/wxportal-api/sysuser/searchOrg";
  96. var getCompanyListPrefix = "http://suishenbang.nipponpaint.com.cn/wxportal-api/sysuser/searchOrg";
  97. $(document).ready(function () {
  98. var formArray = $('#form-configuration-edit').serializeArray();
  99. var formData = {};
  100. $(formArray ).each(function(index, obj){
  101. formData[obj.name] = obj.value;
  102. });
  103. $("#userType").selectpicker('val',formData.userType.split(','));
  104. if (formData.salesLevel == 'company_level'){
  105. var objhx1 = {
  106. parType: 'company_level',
  107. parValue: formData.orgCode
  108. }
  109. var confighuixian1 = {
  110. url: getCompanyListPrefix,
  111. type: "post",
  112. dataType: "json",
  113. data: objhx1,
  114. beforeSend: function () {
  115. $.modal.loading("正在处理中,请稍后...");
  116. },
  117. success: function(result) {
  118. $.modal.closeLoading();
  119. var objList = {
  120. parType: 'diy_level',
  121. parValue: ''
  122. }
  123. getCompanyList(objList,result.levelInfo.company_code);
  124. var objList1 = {
  125. parType: 'company_level',
  126. parValue: result.levelInfo.company_code
  127. }
  128. getCompanyList(objList1,"");
  129. }
  130. }
  131. $.ajax(confighuixian1)
  132. }else if (formData.salesLevel == 'office_level') {
  133. var objhx1 = {
  134. parType: 'office_level',
  135. parValue: formData.orgCode
  136. }
  137. var confighuixian1 = {
  138. url: getCompanyListPrefix,
  139. type: "post",
  140. dataType: "json",
  141. data: objhx1,
  142. beforeSend: function () {
  143. $.modal.loading("正在处理中,请稍后...");
  144. },
  145. success: function(result) {
  146. $.modal.closeLoading();
  147. var objList = {
  148. parType: 'diy_level',
  149. parValue: ''
  150. }
  151. getCompanyList(objList,result.levelInfo.company_code);
  152. var objList1 = {
  153. parType: 'company_level',
  154. parValue: result.levelInfo.company_code
  155. }
  156. getCompanyList(objList1,result.levelInfo.office_code);
  157. var objList2 = {
  158. parType: 'office_level',
  159. parValue: result.levelInfo.office_code
  160. }
  161. getCompanyList(objList2,"");
  162. }
  163. }
  164. $.ajax(confighuixian1)
  165. }else if (formData.salesLevel == 'suboffice_level') {
  166. var objhx1 = {
  167. parType: 'suboffice_level',
  168. parValue: formData.orgCode
  169. }
  170. var confighuixian1 = {
  171. url: getCompanyListPrefix,
  172. type: "post",
  173. dataType: "json",
  174. data: objhx1,
  175. beforeSend: function () {
  176. $.modal.loading("正在处理中,请稍后...");
  177. },
  178. success: function(result) {
  179. $.modal.closeLoading();
  180. var objList = {
  181. parType: 'diy_level',
  182. parValue: ''
  183. }
  184. getCompanyList(objList,result.levelInfo.company_code);
  185. var objList1 = {
  186. parType: 'company_level',
  187. parValue: result.levelInfo.company_code
  188. }
  189. getCompanyList(objList1,result.levelInfo.office_code);
  190. var objList2 = {
  191. parType: 'office_level',
  192. parValue: result.levelInfo.office_code
  193. }
  194. getCompanyList(objList2,result.levelInfo.suboffice_code);
  195. }
  196. }
  197. $.ajax(confighuixian1)
  198. }else {
  199. var objList = {
  200. parType: "diy_level",
  201. parValue: ""
  202. }
  203. getCompanyList(objList,"");
  204. }
  205. })
  206. $("#form-configuration-edit").validate({
  207. focusCleanup: true,
  208. rules:{
  209. alertContent:{
  210. required:true
  211. },
  212. alertStartTime:{
  213. required:true
  214. },
  215. alertEndTime:{
  216. required:true
  217. },
  218. alertNum: {
  219. required:true
  220. },
  221. userType: {
  222. required:true
  223. }
  224. }
  225. });
  226. function submitHandler() {
  227. if ($.validate.form()) {
  228. var alertId = $('#alertId').val();
  229. var contentVal = $('#alertContent').val();
  230. var startTime = $('#alertStartTime').val();
  231. var endTime = $('#alertEndTime').val();
  232. var alertNum = $('#alertNum').val();
  233. var userType = $('#userType').val().join();
  234. var objSubmit = {
  235. alertId:alertId,
  236. alertContent:contentVal,
  237. alertStartTime:startTime,
  238. alertEndTime:endTime,
  239. alertNum:alertNum,
  240. userType:userType,
  241. alertStatus:'0'
  242. }
  243. if ($('#deptType3').val() != "") {
  244. objSubmit.salesLevel = 'suboffice_level';
  245. objSubmit.orgCode = $('#deptType3').val();
  246. objSubmit.orgName = $('#deptType3').find("option:selected")[0].label
  247. }
  248. if ($('#deptType2').val() != "" && $('#deptType3').val() == "") {
  249. objSubmit.salesLevel = 'office_level';
  250. objSubmit.orgCode = $('#deptType2').val();
  251. objSubmit.orgName = $('#deptType2').find("option:selected")[0].label
  252. }
  253. if ($('#deptType1').val() != "" && $('#deptType2').val() == "" && $('#deptType3').val() == "") {
  254. objSubmit.salesLevel = 'company_level';
  255. objSubmit.orgCode = $('#deptType1').val();
  256. objSubmit.orgName = $('#deptType1').find("option:selected")[0].label
  257. }
  258. if ($('#deptType1').val() == "" && $('#deptType2').val() == "" && $('#deptType3').val() == "") {
  259. objSubmit.salesLevel = 'diy_level';
  260. }
  261. console.log('objSubmit', objSubmit);
  262. var configSubmit = {
  263. url: prefix + "/edit",
  264. type: "post",
  265. dataType: "json",
  266. data: objSubmit,
  267. beforeSend: function () {
  268. $.modal.loading("正在处理中,请稍后...");
  269. },
  270. success:function (result) {
  271. $.modal.closeLoading();
  272. $.operate.successCallback(result);
  273. }
  274. }
  275. $.ajax(configSubmit)
  276. }
  277. // $.operate.save(prefix + "/edit", $('#form-configuration-edit').serialize());
  278. }
  279. $("input[name='alertStartTime']").datetimepicker({
  280. format: "yyyy-mm-dd hh:ii",
  281. autoclose: true
  282. });
  283. $("input[name='alertEndTime']").datetimepicker({
  284. format: "yyyy-mm-dd hh:ii",
  285. autoclose: true
  286. });
  287. $("#deptType1").on('change',function () {
  288. if ($(this).val() != -1){
  289. var obj1 = {
  290. parType: "company_level",
  291. parValue: $(this).val()
  292. }
  293. $("#deptType2").empty().append("");
  294. $("#deptType2").selectpicker('refresh');
  295. $("#deptType3").empty().append("");
  296. $("#deptType3").selectpicker('refresh');
  297. getCompanyList(obj1,"");
  298. }
  299. })
  300. $("#deptType2").on('change',function () {
  301. if ($(this).val() != -1){
  302. var obj2 = {
  303. parType: "office_level",
  304. parValue: $(this).val()
  305. }
  306. $("#deptType3").empty().append("");
  307. $("#deptType3").selectpicker('refresh');
  308. getCompanyList(obj2,"");
  309. }
  310. })
  311. $("#clearSelect").on('click',function () {
  312. var obj3 = {
  313. parType: "diy_level",
  314. parValue: ""
  315. }
  316. $("#deptType1").empty().append("");
  317. $("#deptType1").selectpicker('refresh');
  318. $("#deptType2").empty().append("");
  319. $("#deptType2").selectpicker('refresh');
  320. $("#deptType3").empty().append("");
  321. $("#deptType3").selectpicker('refresh');
  322. getCompanyList(obj3,"");
  323. })
  324. /* 获取公司列表 */
  325. function getCompanyList(obj,chooseId) {
  326. var config = {
  327. url: getCompanyListPrefix,
  328. type: "post",
  329. dataType: "json",
  330. data: obj,
  331. beforeSend: function () {
  332. $.modal.loading("正在处理中,请稍后...");
  333. },
  334. success: function(result) {
  335. $.modal.closeLoading();
  336. var companyList = result.dataList;
  337. if (companyList && companyList.length != 0){
  338. var options = '';
  339. if (obj.parType == 'diy_level'){
  340. companyList.forEach(item=>{
  341. if(item.company_code == chooseId){
  342. options += "<option value='" + item.company_code + "' selected='selected'>" + item.company_name + "</option>"
  343. }else{
  344. options += "<option value='" + item.company_code + "'>" + item.company_name + "</option>"
  345. }
  346. })
  347. $("#deptType1").append(options);
  348. $("#deptType1").selectpicker('refresh');
  349. $("#deptType1").selectpicker('render');
  350. } else if (obj.parType == 'company_level') {
  351. companyList.forEach(item=>{
  352. if(item.office_code == chooseId){
  353. options += "<option value='" + item.office_code + "' selected='selected'>" + item.office_name + "</option>"
  354. }else{
  355. options += "<option value='" + item.office_code + "'>" + item.office_name + "</option>"
  356. }
  357. })
  358. $("#deptType2").append(options);
  359. $("#deptType2").selectpicker('refresh');
  360. $("#deptType2").selectpicker('render');
  361. }else {
  362. companyList.forEach(item=>{
  363. if(item.suboffice_code == chooseId){
  364. options += "<option value='" + item.suboffice_code + "' selected='selected'>" + item.suboffice_name + "</option>"
  365. }else{
  366. options += "<option value='" + item.suboffice_code + "'>" + item.suboffice_name + "</option>"
  367. }
  368. })
  369. $("#deptType3").append(options);
  370. $("#deptType3").selectpicker('refresh');
  371. $("#deptType3").selectpicker('render');
  372. }
  373. }
  374. }
  375. };
  376. $.ajax(config)
  377. }
  378. </script>
  379. </body>
  380. </html>