更换富文本编辑器为【wangEditor3】

pom.xml

@@ -38,12 +38,6 @@
             <version>3.3</version>
         </dependency>
 
-        <dependency>
-            <groupId>com.jfinal</groupId>
-            <artifactId>jfinal</artifactId>
-            <version>3.3</version>
-        </dependency>
-
     </dependencies>
 
 

root/index.html

@@ -162,7 +162,6 @@
                 <!--最新加入-->
                 <div class="fly-panel fly-rank fly-rank-reply" id="LAY_replyRank">
                     <h3 class="fly-panel-title">
-                        最新加入|
                         总用户：<span id="user_count">0</span>人
                     </h3>
                     <dl>

root/jie/add.html

@@ -68,8 +68,11 @@
                                 </div>
                             </div>
                             <div class="layui-form-item layui-form-text">
-                                <div class="layui-input-block">
+                                <!--<div class="layui-input-block">
                                     <textarea id="L_content" name="content" required lay-verify="required" placeholder="详细描述" class="layui-textarea fly-editor" style="height: 260px;">#(bean.content??)</textarea>
+                                </div>-->
+                                <div id="editor">
+                                    #(bean.content??)
                                 </div>
                             </div>
                             <!--<div class="layui-form-item">
@@ -110,6 +113,7 @@
 #end
 
 #define js()
+<script src="//unpkg.com/wangeditor/release/wangEditor.min.js"></script>
 <script>
     layui.cache.page = 'jie';
     layui.cache.user = {
@@ -124,6 +128,9 @@
         , base: '../../res/mods/'
     }).extend({
         fly: 'index'
-    }).use('fly');
+    }).use(['fly','jie'], function () {
+        var jie = layui.jie;
+        jie.createEditer();
+    });
 </script>
 #end

root/jie/detail.html

@@ -89,8 +89,8 @@
 						<div class="fly-detail-user">
 						<a href="" class="fly-link">
 							<cite>#(x.nickname)</cite>
-							<i class="iconfont icon-renzheng" title="认证信息：XXX"></i>
+							<!--<i class="iconfont icon-renzheng" title="认证信息：XXX"></i>
-							<i class="layui-badge fly-badge-vip">VIP3</i>
+							<i class="layui-badge fly-badge-vip">VIP3</i>-->
 						</a>
 						#if(x.userId == bean.userId??)
 						<span>(楼主)</span>
@@ -137,9 +137,10 @@
 					<form action="/jie/reply/" method="post">
 						<div class="layui-form-item layui-form-text">
 						<a name="comment"></a>
-							<div class="layui-input-block">
+							<!--<div class="layui-input-block">
-								<textarea id="L_content" name="content" required lay-verify="required" placeholder="请输入内容"  class="layui-textarea fly-editor" style="height: 150px;"></textarea>
+								<textarea id="mytextarea">Hello, World!</textarea>
-							</div>
+							</div>-->
+							<div id="editor"></div>
 						</div>
 						<div class="layui-form-item">
 							<input type="hidden" name="contentId" value="#(bean.contentId??)">
@@ -186,6 +187,7 @@
 #end
 
 #define js()
+<script src="//unpkg.com/wangeditor/release/wangEditor.min.js"></script>
 <script>
     layui.cache.page = 'jie';
     layui.cache.user = {
@@ -200,14 +202,16 @@
         ,base: '../../res/mods/'
     }).extend({
         fly: 'index'
-    }).use('fly', function(){
+    }).use(['fly', 'jie'], function(){
         var $ = layui.jquery, fly = layui.fly;
+        var jie = layui.jie;
         //如果你是采用模版自带的编辑器，你需要开启以下语句来解析。
-        $('.detail-body').each(function(){
+        /*$('.detail-body').each(function(){
           var othis = $(this), html = othis.html();
           othis.html(fly.content(html));
-        });
+        });*/
 
+        jie.createEditer();
     });
 </script>
 #end

root/res/mods/index.js

@@ -250,6 +250,15 @@ layui.define(['layer', 'laytpl', 'form', 'element', 'upload', 'util', 'face'], f
       
     }
 
+    ,editer: function(){
+          var E = window.wangEditor;
+          var editor = new E('#editor');
+          editor.customConfig.uploadImgServer = '/upload/img';
+          editor.create()
+
+          return editor;
+    }
+
     ,escape: function(html){
       return String(html||'').replace(/&(?!#?[a-zA-Z0-9]+;)/g, '&')
       .replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/'/g, '&#39;').replace(/"/g, '&quot;');

root/res/mods/jie.js

@@ -13,13 +13,20 @@ layui.define(['fly','laypage'], function(exports){
   var form = layui.form;
   var laypage = layui.laypage;
   var fly = layui.fly;
-  
+
+  var editor;
   var gather = {}, dom = {
     jieda: $('#jieda')
     ,content: $('#L_content')
     ,jiedaCount: $('#jiedaCount')
   };
 
+  var jie = {
+      createEditer : function(){
+          editor = fly.editer();
+      }
+  }
+
   //监听专栏选择
   form.on('select(column)', function(obj){
     var value = obj.value
@@ -233,6 +240,7 @@ layui.define(['fly','laypage'], function(exports){
       ["contentId","title", "content", "type"].forEach(function (value) {
         bean[value] = data.field[value];
       });
+      bean["content"] = editor.txt.html();
       console.log(bean);
 
       fly.json("/os/content/save",{
@@ -249,6 +257,7 @@ layui.define(['fly','laypage'], function(exports){
       ["contentId","pid", "content"].forEach(function (value) {
         bean[value] = data.field[value];
       });
+      bean["content"] = editor.txt.html();
       console.log(bean);
 
       fly.json("/os/comment/save",{
@@ -305,5 +314,5 @@ layui.define(['fly','laypage'], function(exports){
       });
   }
 
-  exports('jie', null);
+  exports('jie', jie);
 });

src/com/lxyer/bbs/servlet/IndexServlet.java

@@ -6,9 +6,9 @@ import com.lxyer.bbs.base.user.User;
 import com.lxyer.bbs.base.user.UserBean;
 import com.lxyer.bbs.base.user.UserInfo;
 import com.lxyer.bbs.comment.CommentInfo;
+import com.lxyer.bbs.comment.CommentService;
 import com.lxyer.bbs.content.ContentBean;
 import com.lxyer.bbs.content.ContentInfo;
-import com.lxyer.bbs.comment.CommentService;
 import com.lxyer.bbs.content.ContentService;
 import org.redkale.net.http.*;
 import org.redkale.source.FilterExpress;
@@ -17,6 +17,12 @@ import org.redkale.source.Flipper;
 import org.redkale.util.Sheet;
 
 import javax.annotation.Resource;
+import java.io.File;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
 import java.util.concurrent.CompletableFuture;
 import java.util.function.Supplier;
 
@@ -26,6 +32,7 @@ import java.util.function.Supplier;
 @WebServlet({"/","/column","/column/*"
         ,"/user", "/user/*"
         ,"/jie" ,"/jie/*"
+        ,"/upload","/upload/*"
 })
 public class IndexServlet extends BaseServlet {
 
@@ -237,6 +244,39 @@ public class IndexServlet extends BaseServlet {
 
     //====================================帖子相关====================================
 
+    //====================================上传相关====================================、
+
+    private static final String dir = "/var/www/upload/redbbs/";
+    private static final String view = "http://img.1216.top/redbbs/";
+    private static final String format = "%1$tY%1$tm%1$td%1$tH%1$tM%1$tS";
+    protected static final boolean winos = System.getProperty("os.name").contains("Window");
+    @HttpMapping(url = "/upload/img", auth = false, comment = "图片上传")
+    public void uploadImg(HttpRequest request, HttpResponse response){
+        try {
+            Map ret = new HashMap();
+            ret.put("errno", 0);
+            List data = new ArrayList();
+
+            for (MultiPart part : request.multiParts()) {
+                String name = part.getName();
+                String suffix = name.substring(name.lastIndexOf("."));
+                String path = String.format(format, System.currentTimeMillis()) + suffix;
+                File destFile = new File((winos ? "D:/wk/_own/redbbs/root/tem/" : dir) + path);
+                destFile.getParentFile().mkdir();
+
+                part.save(destFile);
+
+                data.add((winos ? "/tem/": view) + path);
+            }
+            ret.put("data", data);
+
+            response.setContentType("application/json; charset=utf-8");
+            response.finish(ret);
+        } catch (IOException e) {
+            e.printStackTrace();
+        }
+
+    }
 
 
 }