add.html 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408
  1. <!DOCTYPE HTML>
  2. <html xmlns:th="http://www.thymeleaf.org"
  3. xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
  4. layout:decorate="~{admin/common/common}">
  5. <head>
  6. <title>添加</title>
  7. <style>
  8. multiple:hover .dropdown-clear-all, .dropdown-single:hover .dropdown-clear-all {
  9. display: none;
  10. }
  11. .line {
  12. display: block;
  13. text-align: left;
  14. background-color: #fff;
  15. color: #333;
  16. border-bottom: 1px solid #0a6999;
  17. border-color: #fff;
  18. border-bottom: 1px solid #0a6999;
  19. margin-top: 10px;
  20. vertical-align: middle;
  21. padding: 4px 12px;
  22. height: 31px;
  23. line-height: 31px;
  24. font-size: 14px;
  25. font-weight: bold;
  26. }
  27. </style>
  28. </head>
  29. <body layout:fragment="content">
  30. <article class="page-container">
  31. <form class="form form-horizontal" id="form-add">
  32. <div class="line">基本信息</div>
  33. <div class="row cl">
  34. <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>项目标题:</label>
  35. <div class="formControls col-xs-8 col-sm-9">
  36. <input type="text" class="input-text" placeholder="请输入项目标题" id="title" name="title"/>
  37. </div>
  38. </div>
  39. <div class="row cl">
  40. <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>项目用地:</label>
  41. <div class="formControls col-xs-8 col-sm-9">
  42. <input type="text" class="input-text" placeholder="请输入项目用地" id="location" name="location"/>
  43. </div>
  44. </div>
  45. <div class="row cl">
  46. <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>项目介绍:</label>
  47. <div class="formControls col-xs-8 col-sm-9">
  48. <textarea id="content" name="content" required></textarea>
  49. </div>
  50. </div>
  51. <div class="row cl" th:id="upload_file">
  52. <label class="form-label col-xs-4 col-sm-2"><span>项目附件:</span></label>
  53. <div class="formControls col-xs-8 col-sm-9">
  54. <!-- <div class="uploader-thum-container">-->
  55. <!-- <div id="fileListPre" class="uploader-list"></div>-->
  56. <!-- <div id="filePicker">选择文件</div>-->
  57. <!-- </div>-->
  58. <div><i class="Hui-iconfont" style="cursor: pointer;"
  59. th:onclick="'javascript:addFileLine(\'upload_file\')'">&#xe600; 添加</i></div>
  60. <table class="table table-border table-bordered table-bg table-hover ">
  61. <thead>
  62. <tr class="text-c">
  63. <th>文件</th>
  64. <th>操作</th>
  65. </tr>
  66. </thead>
  67. <tbody class="add_file_line" th:id="'tbody_upload_file'">
  68. <!-- <tr class="text-c">-->
  69. <!-- <td class="td_material">-->
  70. <!-- <div>-->
  71. <!-- <input class="uploadFileName btn btn-upload radius" name="uploadFileName"-->
  72. <!-- readonly="readonly"-->
  73. <!-- type="text" value="上传文件"-->
  74. <!-- th:onclick="'javascript:addFileByName(\'/land_supply/addApplyFile\',this);'"/>-->
  75. <!-- <input class="uploadFileId" type="hidden"-->
  76. <!-- th:name="'fileList[0].file_id'"/>-->
  77. <!-- </div>-->
  78. <!-- </td>-->
  79. <!-- <td class="icon_font"><i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>-->
  80. <!-- </td>-->
  81. <!-- </tr>-->
  82. </tbody>
  83. </table>
  84. </div>
  85. </div>
  86. <div th:if="*{canAsk}" th:each="item,itemStat: ${consulDepartmentList}">
  87. <div class="line">[[${item.name}]]</div>
  88. <div class="row cl">
  89. <label class="form-label col-xs-4 col-sm-2"></label>
  90. <div class="formControls col-xs-8 col-sm-9">
  91. <input type="checkbox" th:name="'defaultList['+${itemStat.index}+']'" th:value="${item.id}">要求反馈意见
  92. </div>
  93. </div>
  94. <div class="row cl" th:id=" 'department'+${item.id}">
  95. <label class="form-label col-xs-4 col-sm-2"></label>
  96. <div class="formControls col-xs-8 col-sm-9">
  97. <div><i class="Hui-iconfont" style="cursor: pointer;"
  98. th:onclick="'javascript:addQuestionLine(\''+'department'+${item.id}+'\')'">&#xe600; 添加</i>
  99. </div>
  100. <table class="table table-border table-bordered table-bg table-hover ">
  101. <thead>
  102. <tr class="text-c">
  103. <th>咨询问题</th>
  104. <th>操作</th>
  105. </tr>
  106. </thead>
  107. <tbody class="add_file_line" th:id="'tbody_department'+${item.id}">
  108. <tr class="text-c">
  109. <td class="td_material">
  110. <input type="text" class="input-text consultation" placeholder="请输入咨询的问题"
  111. th:name="'consultationList['+${itemStat.index}+'].consultation'"/>
  112. <input class="department_id" type="hidden"
  113. th:name="'consultationList['+${itemStat.index}+'].department_id'"
  114. th:value="${item.id}"/>
  115. </td>
  116. <td class="icon_font"><i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>
  117. </td>
  118. </tr>
  119. </tbody>
  120. </table>
  121. </div>
  122. </div>
  123. </div>
  124. <div class="row cl text-c" style="background-color: white">
  125. <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
  126. <a onclick="save()" class="btn btn-secondary radius"><i class="Hui-iconfont">&#xe632;</i>保存草稿</a>
  127. <a onclick="release()" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe632;</i>提交 </a>
  128. <a onClick="removeIframe();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</a>
  129. </div>
  130. </div>
  131. </form>
  132. </article>
  133. <script type="text/javascript" th:src="@{/h-ui/lib/webuploader/0.1.5/webuploader.min.js}"></script>
  134. <script th:inline="javascript">
  135. //富文本kindeditor初始化
  136. var editor;
  137. KindEditor.ready(function (K) {
  138. editor = K.create('#content', {
  139. uploadJson: pagePath + '/upload/kindEditorUpload',
  140. cssData: 'body {font-family: "微软雅黑"; font-size: 14px}',
  141. allowFileManager: false,
  142. allowUpload: true,
  143. width: "100%",
  144. height: "350px",
  145. items: array,
  146. syncType: "auto",
  147. filterMode: false,
  148. afterBlur: function () {
  149. this.sync();
  150. }
  151. });
  152. });
  153. $(function () {
  154. // 初始化上传
  155. var options = {
  156. uploadBtnId: '#filePicker',
  157. picturePreId: 'fileListPre',
  158. hiddenPictureUrl: 'img',
  159. hiddenPictureName: 'imgName',
  160. width: 81,
  161. height: 81,
  162. fileSizeLimit: 100 * 1024 * 1024,
  163. fileSingleSizeLimit: 100 * 1024 * 1024
  164. };
  165. var webUploadDoc = new $WebUploadDoc(options);
  166. webUploadDoc.init();
  167. // var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  168. // var isOpera = userAgent.indexOf("Opera") > -1;
  169. // //判断是否IE浏览器
  170. // if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
  171. // $("#apply_startdate").remove();
  172. // $("#apply_enddate").remove();
  173. // } else {
  174. // $("#apply_startdateIE").remove();
  175. // $("#apply_enddateIE").remove();
  176. // var startDate = laydate.render({
  177. // elem: '#apply_startdate',
  178. // type: 'datetime',
  179. // done: function (value, date) {
  180. // setTimeout(function () {
  181. // $("#form-add").validate().element($("#apply_startdate"));
  182. // }, 100)
  183. // if (value !== '') {
  184. // endDate.config.min.year = date.year;
  185. // endDate.config.min.month = date.month - 1;
  186. // endDate.config.min.date = date.date;
  187. // endDate.config.min.hours = date.hours;
  188. // endDate.config.min.minutes = date.minutes;
  189. // endDate.config.min.seconds = date.seconds;
  190. // } else {
  191. // endDate.config.min.year = '1900';
  192. // endDate.config.min.month = '0';
  193. // endDate.config.min.date = '1';
  194. // endDate.config.min.hours = '0';
  195. // endDate.config.min.minutes = '0';
  196. // endDate.config.min.seconds = '0';
  197. // }
  198. // }
  199. // });
  200. //
  201. // var endDate = laydate.render({
  202. // elem: '#apply_enddate',
  203. // type: 'datetime',
  204. // done: function (value, date) {
  205. // setTimeout(function () {
  206. // $("#form-add").validate().element($("#apply_enddate"));
  207. // }, 100)
  208. // if (value !== '') {
  209. // startDate.config.max.year = date.year;
  210. // startDate.config.max.month = date.month - 1;
  211. // startDate.config.max.date = date.date;
  212. // startDate.config.max.hours = date.hours;
  213. // startDate.config.max.minutes = date.minutes;
  214. // startDate.config.max.seconds = date.seconds;
  215. // } else {
  216. // startDate.config.max.year = '2100';
  217. // startDate.config.max.month = '0';
  218. // startDate.config.max.date = '1';
  219. // startDate.config.max.hours = '0';
  220. // startDate.config.max.minutes = '0';
  221. // startDate.config.max.seconds = '0';
  222. // }
  223. // }
  224. // });
  225. // }
  226. });
  227. //取消
  228. function removeIframe() {
  229. var index = parent.layer.getFrameIndex(window.name);
  230. parent.layer.close(index);
  231. }
  232. //默认状态为草稿
  233. var state = '0';
  234. $("#form-add").validate({
  235. rules: {
  236. title: {
  237. required: true,
  238. },
  239. location: {
  240. required: true,
  241. },
  242. content: {
  243. required: true,
  244. }
  245. },
  246. onkeyup: false,
  247. focusCleanup: true,
  248. focusInvalid: false,
  249. success: "valid",
  250. submitHandler: function (form) {
  251. if (editor.isEmpty()) {
  252. errorMessage('请输入项目介绍');
  253. return false;
  254. } else if (editor.text().length > 2000) {
  255. //errorMessage('项目内容最多2000字');
  256. //return false;
  257. }
  258. // var ids = [];
  259. // $("input[name='defaultList']:checked").each(function(i){
  260. // ids.push($(this).val())
  261. // })
  262. $(form).ajaxSubmit({
  263. type: 'post',
  264. url: pagePath + "/land_supply/save",
  265. dataType: "json",
  266. data: {
  267. state: state,
  268. content_text: editor.text()/*,
  269. defaultList: ids*/
  270. },
  271. success: function (result) {
  272. if (result.success) {
  273. succeedMessage(result.message);
  274. setTimeClose();
  275. } else {
  276. // $(form).find(":submit").attr("disabled", false);
  277. errorMessage(result.message);
  278. }
  279. },
  280. error: function () {
  281. errorMessage('系统错误!');
  282. }
  283. });
  284. return false; // 非常重要,如果是false,则表明是不跳转,在本页上处理,也就是ajax,如果是非false,则传统的form跳转。
  285. }
  286. });
  287. //发布
  288. function release() {
  289. state = "1";
  290. $("#form-add").submit();
  291. }
  292. //保存草稿
  293. function save() {
  294. state = "0";
  295. $("#form-add").ajaxSubmit({
  296. type: 'post',
  297. url: pagePath + "/land_supply/save",
  298. dataType: "json",
  299. data: {
  300. state: state,
  301. content_text: editor.text()
  302. },
  303. success: function (data) {
  304. if (data.success) {
  305. succeedMessage(data.message);
  306. setTimeClose();
  307. } else {
  308. // $(form).find(":submit").attr("disabled", false);
  309. errorMessage(data.message);
  310. }
  311. },
  312. error: function () {
  313. errorMessage('系统错误!');
  314. }
  315. });
  316. }
  317. var departmentList = [[${consulDepartmentList}]];
  318. var index = departmentList.length;
  319. function addQuestionLine(divId) {
  320. var length = index;
  321. if ($("#" + divId).find('.add_file_line>tr').length > 0) {
  322. var html = "<i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>";
  323. $("#" + divId).find(".add_file_line tr:eq(0)").clone().insertAfter($("#" + divId).find('.add_file_line>tr').eq(-1))
  324. .find(".consultation").removeAttr("name").attr("name", "consultationList[" + length + "].consultation").val("").end()
  325. .find(".department_id").removeAttr("name").attr("name", "consultationList[" + length + "].department_id").end()
  326. .find(".icon_font").html(html).end();
  327. } else {
  328. var str = "";
  329. str += "<tr class='text-c'>"
  330. str += "<td class='td_material'>"
  331. str += "<input type='text' class='input-text consultation' placeholder='请输入咨询的问题' name='consultationList[" + length + "].consultation'/>"
  332. str += "<input class='department_id' type='hidden' value='" + divId.split("department")[1] + "' name='consultationList[" + length + "].department_id' />"
  333. str += "</td>"
  334. str += "<td class='icon_font'><i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>"
  335. str += "</td>"
  336. str += "</tr>"
  337. $("#tbody_" + divId).html(str);
  338. }
  339. $('#layui-layer2').height(48);
  340. index++;
  341. }
  342. var file_index = 0;
  343. function addFileLine(divId) {
  344. if (file_index == undefined) {
  345. file_index = 0
  346. }
  347. var length = file_index;
  348. if ($("#" + divId).find('.add_file_line>tr').length > 0) {
  349. var html = "<i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>";
  350. $("#" + divId).find(".add_file_line tr:eq(0)").clone().insertAfter($("#" + divId).find('.add_file_line>tr').eq(-1))
  351. .find(".uploadFileId").removeAttr("name").attr("name", "fileList[" + length + "].file_id").val("").end()
  352. .find(".uploadFileName").val("上传文件").end()
  353. .find(".icon_font").html(html).end();
  354. } else {
  355. var str = "";
  356. str += "<tr class='text-c'>"
  357. str += "<td class='td_material'>"
  358. str += "<div>"
  359. str += "<input class='uploadFileName btn btn-upload radius' name='uploadFileName' readonly='readonly' type='text' value='上传文件' onclick=\"addFileByName('/land_supply/addApplyFile',this);\"/>"
  360. str += "<input class='uploadFileId' hidden name='fileList[" + length + "].file_id'/>"
  361. str += "</div>"
  362. str += "</td>"
  363. str += "<td class='icon_font'><i class='Hui-iconfont' onclick='removeLine(this)'>&#xe6a1; 删除</i>"
  364. str += "</td>"
  365. str += "</tr>"
  366. $("#tbody_" + divId).html(str);
  367. }
  368. $('#layui-layer2').height(48);
  369. file_index++;
  370. }
  371. //添加相应name的文件
  372. function addFileByName(url, obj) {
  373. var name = $(obj).next().attr("name");
  374. url += "?fileIdName=" + name;
  375. layer_show('添加文件', pagePath + url, 800, 350);
  376. }
  377. function removeLine(obj) {
  378. $(obj).parent().parent().remove();
  379. }
  380. </script>
  381. </body>
  382. </html>