mail_send.jsp 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. <%@ page contentType="text/html;charset=UTF-8" %>
  2. <%@ include file="/webpage/include/taglib.jsp"%>
  3. <!DOCTYPE html>
  4. <html>
  5. <head>
  6. <meta charset="utf-8">
  7. <meta name="decorator" content="default"/>
  8. <!-- SUMMERNOTE -->
  9. <link href="${ctxStatic}/summernote/summernote.css" rel="stylesheet">
  10. <link href="${ctxStatic}/summernote/summernote-bs3.css" rel="stylesheet">
  11. <script src="${ctxStatic}/summernote/summernote.min.js"></script>
  12. <script src="${ctxStatic}/summernote/summernote-zh-CN.js"></script>
  13. <style>
  14. body{
  15. background-color:transparent;
  16. filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26FFFFFF, endColorstr=#26FFFFFF);
  17. color:#ffffff;
  18. background-color:rgba(255,255,255,0);
  19. height:100%;
  20. }
  21. .content-height{
  22. height:calc(100% - 8px);
  23. }
  24. .note-editable{
  25. min-height: 200px;
  26. }
  27. </style>
  28. </head>
  29. <body >
  30. <div class="wrapper wrapper-content full-width">
  31. <sys:message content="${message}"/>
  32. <div class="pr full-height full-width">
  33. <div class="fl contents col-sm-3 full-height" style="padding: 0px;">
  34. <div class="layui-row contentShadow content-height">
  35. <div class="ibox-content mailbox-content">
  36. <div class="file-manager">
  37. <a style="width:inherit;" class="btn btn-block btn-primary compose-mail" href="${ctx}/iim/mailCompose/sendLetter">写信</a>
  38. <div class="space-25"></div>
  39. <h5>文件夹</h5>
  40. <ul class="folder-list m-b-md" style="padding: 0">
  41. <li>
  42. <a href="${ctx}/iim/mailBox/list?orderBy=sendtime desc"> <i class="fa fa-inbox "></i> 收件箱 <span class="label label-warning pull-right">${noReadCount}/${mailBoxCount}</span>
  43. </a>
  44. </li>
  45. <li>
  46. <a href="${ctx}/iim/mailCompose/list?status=1&orderBy=sendtime desc"> <i class="fa fa-envelope-o"></i> 已发送<span class="label label-info pull-right">${mailComposeCount}</span></a>
  47. </li>
  48. <!--
  49. <li>
  50. <a href="${ctx}/iim/mailBox/list"> <i class="fa fa-envelope"></i> 群邮件</a>
  51. </li>
  52. -->
  53. <li>
  54. <a href="${ctx}/iim/mailCompose/list?status=0&orderBy=sendtime desc"> <i class="fa fa-file-text-o"></i> 草稿箱 <span class="label label-danger pull-right">${mailDraftCount}</span>
  55. </a>
  56. </li>
  57. <!-- 等待下个版本升级 by刘高峰
  58. <li>
  59. <a href="mailbox.html"> <i class="fa fa-trash-o"></i> 垃圾箱</a>
  60. </li>
  61. -->
  62. </ul>
  63. <h5>分类</h5>
  64. <ul class="category-list" style="padding: 0">
  65. <li>
  66. <a href="javascript:void(0)"> <i class="fa fa-circle text-navy"></i> 工作</a>
  67. </li>
  68. <li>
  69. <a href="javascript:void(0)"> <i class="fa fa-circle text-danger"></i> 文档</a>
  70. </li>
  71. <li>
  72. <a href="javascript:void(0)"> <i class="fa fa-circle text-primary"></i> 社交</a>
  73. </li>
  74. <li>
  75. <a href="javascript:void(0)"> <i class="fa fa-circle text-info"></i> 广告</a>
  76. </li>
  77. <li>
  78. <a href="javascript:void(0)"> <i class="fa fa-circle text-warning"></i> 客户端</a>
  79. </li>
  80. </ul>
  81. <h5 class="tag-title">标签</h5>
  82. <ul class="tag-list" style="padding: 0">
  83. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 朋友</a>
  84. </li>
  85. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 工作</a>
  86. </li>
  87. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 家庭</a>
  88. </li>
  89. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 孩子</a>
  90. </li>
  91. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 假期</a>
  92. </li>
  93. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 音乐</a>
  94. </li>
  95. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 照片</a>
  96. </li>
  97. <li><a href="javascript:void(0)"><i class="fa fa-tag"></i> 电影</a>
  98. </li>
  99. </ul>
  100. <div class="clearfix"></div>
  101. </div>
  102. </div>
  103. </div>
  104. </div>
  105. <div class="fl contents col-sm-9 full-height" style="padding: 0px;">
  106. <div class="layui-row contentShadow content-height">
  107. <div>
  108. <div style="height:30px;padding: 16px;">
  109. <div class="pull-right tooltip-demo">
  110. <button type="button" class="nav-btn nav-btn-add" onclick="saveLetter()"> <i class="fa fa-pencil"></i> 存为草稿</button>
  111. <a href="${ctx}/iim/mailBox/list" class="nav-btn nav-btn-delete" data-toggle="tooltip" data-placement="top" title="放弃"><i class="fa fa-times"></i> 放弃</a>
  112. <input id="btnCancel" style="margin-right:0px;" class="nav-btn nav-btn-refresh" type="button" value="返 回" onclick="history.go(-1)">
  113. </div>
  114. <h2>
  115. 写信
  116. </h2>
  117. </div>
  118. </div>
  119. <div style="height:calc(100% - 62px);overflow-y: auto;">
  120. <div class="mail-body" style="padding: 6px 16px;">
  121. <form:form id="inputForm" modelAttribute="mailBox" action="${ctx}/iim/mailCompose/save" method="post">
  122. <div id="queryDiv" class="commonQuery">
  123. <div class="layui-item query athird" style="width:50%;padding-right: 0;">
  124. <label class="layui-form-label"><span class="require-item">*</span>发送到:</label>
  125. <div class="layui-input-block with-icon">
  126. <sys:treeselect id="receiver" name="receiverIds" value="${receiver.id}" labelName="receiverNames" labelValue="${receiver.name}"
  127. title="用户" url="/sys/office/treeData?type=3" cssClass="form-control layui-input required" notAllowSelectParent="true" checked="true"/>
  128. </div>
  129. </div>
  130. <div class="layui-item query athird" style="width:50%;padding-right: 0;">
  131. <label class="layui-form-label">主题:</label>
  132. <div class="layui-input-block with-icon">
  133. <input type="text" id="title" name="mail.title" class="form-control layui-input" value="">
  134. </div>
  135. </div>
  136. <div style="clear: both;"></div>
  137. </div>
  138. <input type="hidden" id="status" name="status" value="1"><!-- 0 草稿 1 已发送 -->
  139. <input type="hidden" id="overview" name="mail.overview"><!-- 内容简介 -->
  140. <input type="hidden" id="content" name="mail.content"><!-- 内容 -->
  141. </form:form>
  142. </div>
  143. <div style="padding: 0 16px;">
  144. <div class="mail-text">
  145. <div class="summernote">
  146. </div>
  147. <div class="clearfix"></div>
  148. </div>
  149. </div>
  150. <div class="mail-body text-right tooltip-demo" style="border:none;float: right;padding: 16px;">
  151. <button type="button" class="nav-btn nav-btn-edit" onclick="sendLetter()"> <i class="fa fa-reply"></i> 发送</button>
  152. <a href="${ctx}/iim/mailBox/list" class="nav-btn nav-btn-delete" data-toggle="tooltip" data-placement="top" title="Discard email"><i class="fa fa-times"></i> 放弃</a>
  153. <button type="button" style="margin-right: 0px;" class="nav-btn nav-btn-add" onclick="saveLetter()"> <i class="fa fa-pencil"></i> 存为草稿</button>
  154. <div style="clear: both;"></div>
  155. </div>
  156. </div>
  157. </div>
  158. </div>
  159. </div>
  160. </div>
  161. <script>
  162. $(document).ready(function () {
  163. $('.i-checks').iCheck({
  164. checkboxClass: 'icheckbox_square-green',
  165. radioClass: 'iradio_square-green',
  166. });
  167. $('.summernote').summernote({
  168. lang: 'zh-CN'
  169. });
  170. });
  171. var edit = function () {
  172. $('.click2edit').summernote({
  173. focus: true
  174. });
  175. };
  176. var save = function () {
  177. var aHTML = $('.click2edit').code(); //save HTML If you need(aHTML: array).
  178. $('.click2edit').destroy();
  179. };
  180. function sendLetter(){
  181. if($("#receiverRecordId").val()==''){
  182. top.layer.alert('收件人不能为空!', {icon: 0});
  183. return;
  184. }
  185. if($("#title").val()==''){
  186. top.layer.alert('标题不能为空!', {icon: 0});
  187. return;
  188. }
  189. $("#status").val("1");
  190. $("#content").val($(".note-editable").html());
  191. $("#overview").val($(".note-editable").text().substring(0,20));
  192. var index = layer.load(1, {
  193. shade: [0.3,'#fff'] //0.1透明度的白色背景
  194. });
  195. $("#inputForm").submit();
  196. }
  197. function saveLetter(){
  198. if($("#title").val()==''){
  199. top.layer.alert('标题不能为空!', {icon: 0});
  200. return;
  201. }
  202. $("#status").val("0");
  203. $("#content").val($(".note-editable").html());
  204. $("#overview").val($(".note-editable").text().substring(0,20));
  205. var index = layer.load(1, {
  206. shade: [0.3,'#fff'] //0.1透明度的白色背景
  207. });
  208. $("#inputForm").submit();
  209. }
  210. </script>
  211. </body>
  212. </html>