From d8b398d3d81979c2aa24d8effe8ec0c0571f34de Mon Sep 17 00:00:00 2001 From: WangHao <43278047@qq.com> Date: Mon, 5 Oct 2020 21:01:24 +0800 Subject: [PATCH] =?UTF-8?q?TinymceEdit=E7=BC=96=E8=BE=91=E5=99=A8=E9=9B=86?= =?UTF-8?q?=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ruoyi-ui/package.json | 6 +- ruoyi-ui/public/index.html | 13 + ruoyi-ui/public/tinymce/langs/zh_CN.js | 419 +++ .../tinymce/skins/content/dark/content.css | 72 + .../skins/content/dark/content.min.css | 7 + .../tinymce/skins/content/default/content.css | 67 + .../skins/content/default/content.min.css | 7 + .../skins/content/document/content.css | 72 + .../skins/content/document/content.min.css | 7 + .../tinymce/skins/content/writer/content.css | 68 + .../skins/content/writer/content.min.css | 7 + .../tinymce/skins/ui/oxide-dark/content.css | 710 ++++ .../skins/ui/oxide-dark/content.inline.css | 722 ++++ .../ui/oxide-dark/content.inline.min.css | 7 + .../skins/ui/oxide-dark/content.min.css | 7 + .../skins/ui/oxide-dark/content.mobile.css | 29 + .../ui/oxide-dark/content.mobile.min.css | 7 + .../ui/oxide-dark/fonts/tinymce-mobile.woff | Bin 0 -> 4624 bytes .../tinymce/skins/ui/oxide-dark/skin.css | 2972 +++++++++++++++++ .../tinymce/skins/ui/oxide-dark/skin.min.css | 7 + .../skins/ui/oxide-dark/skin.mobile.css | 673 ++++ .../skins/ui/oxide-dark/skin.mobile.min.css | 7 + .../public/tinymce/skins/ui/oxide/content.css | 728 ++++ .../tinymce/skins/ui/oxide/content.inline.css | 722 ++++ .../skins/ui/oxide/content.inline.min.css | 7 + .../tinymce/skins/ui/oxide/content.min.css | 7 + .../tinymce/skins/ui/oxide/content.mobile.css | 29 + .../skins/ui/oxide/content.mobile.min.css | 7 + .../skins/ui/oxide/fonts/tinymce-mobile.woff | Bin 0 -> 4624 bytes .../public/tinymce/skins/ui/oxide/skin.css | 2972 +++++++++++++++++ .../tinymce/skins/ui/oxide/skin.min.css | 7 + .../tinymce/skins/ui/oxide/skin.mobile.css | 673 ++++ .../skins/ui/oxide/skin.mobile.min.css | 7 + ruoyi-ui/src/components/TinyMCE/index.vue | 129 + ruoyi-ui/src/components/TinyMCE/plugins.js | 7 + ruoyi-ui/src/components/TinyMCE/toolbar.js | 7 + .../src/views/bookmark/common/NqQuillEdit.vue | 83 +- 37 files changed, 11235 insertions(+), 36 deletions(-) create mode 100644 ruoyi-ui/public/tinymce/langs/zh_CN.js create mode 100644 ruoyi-ui/public/tinymce/skins/content/dark/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/dark/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/default/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/default/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/document/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/document/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/writer/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/content/writer/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.inline.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.inline.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.mobile.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/content.mobile.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/fonts/tinymce-mobile.woff create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/skin.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/skin.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/skin.mobile.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide-dark/skin.mobile.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.inline.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.inline.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.mobile.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/content.mobile.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/fonts/tinymce-mobile.woff create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/skin.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/skin.min.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/skin.mobile.css create mode 100644 ruoyi-ui/public/tinymce/skins/ui/oxide/skin.mobile.min.css create mode 100644 ruoyi-ui/src/components/TinyMCE/index.vue create mode 100644 ruoyi-ui/src/components/TinyMCE/plugins.js create mode 100644 ruoyi-ui/src/components/TinyMCE/toolbar.js diff --git a/ruoyi-ui/package.json b/ruoyi-ui/package.json index 3a7949bfd..443e60484 100644 --- a/ruoyi-ui/package.json +++ b/ruoyi-ui/package.json @@ -41,6 +41,7 @@ }, "dependencies": { "@riophae/vue-treeselect": "0.4.0", + "@tinymce/tinymce-vue": "^3.2.3", "axios": "0.18.1", "clipboard": "2.0.4", "echarts": "4.2.1", @@ -56,6 +57,7 @@ "screenfull": "4.2.0", "sortablejs": "1.8.4", "timeago.js": "^4.0.2", + "tinymce": "^5.5.1", "vue": "2.6.10", "vue-count-to": "1.0.13", "vue-cropper": "0.4.9", @@ -88,10 +90,10 @@ "less-loader": "^7.0.1", "lint-staged": "8.1.5", "mockjs": "1.0.1-beta3", - "node-sass": "^4.9.0", + "node-sass": "^4.14.1", "plop": "2.3.0", "runjs": "^4.3.2", - "sass-loader": "^7.1.0", + "sass-loader": "^7.3.1", "script-ext-html-webpack-plugin": "2.1.3", "script-loader": "0.7.2", "serve-static": "^1.13.2", diff --git a/ruoyi-ui/public/index.html b/ruoyi-ui/public/index.html index 331141931..89bb9ea9d 100644 --- a/ruoyi-ui/public/index.html +++ b/ruoyi-ui/public/index.html @@ -5,10 +5,18 @@ + <%= webpackConfig.name %> + + diff --git a/ruoyi-ui/src/components/TinyMCE/plugins.js b/ruoyi-ui/src/components/TinyMCE/plugins.js new file mode 100644 index 000000000..058d2aef7 --- /dev/null +++ b/ruoyi-ui/src/components/TinyMCE/plugins.js @@ -0,0 +1,7 @@ +// Any plugins you want to use has to be imported +// Detail plugins list see https://www.tinymce.com/docs/plugins/ +// Custom builds see https://www.tinymce.com/download/custom-builds/ + +const plugins = ['advlist anchor autolink autosave code codesample colorpicker colorpicker contextmenu directionality emoticons fullscreen hr image imagetools insertdatetime link lists media nonbreaking noneditable pagebreak paste preview print save searchreplace spellchecker tabfocus table template textcolor textpattern visualblocks visualchars wordcount'] + +export default plugins diff --git a/ruoyi-ui/src/components/TinyMCE/toolbar.js b/ruoyi-ui/src/components/TinyMCE/toolbar.js new file mode 100644 index 000000000..5c8ce1071 --- /dev/null +++ b/ruoyi-ui/src/components/TinyMCE/toolbar.js @@ -0,0 +1,7 @@ +// Here is a list of the toolbar +// Detail list see https://www.tinymce.com/docs/advanced/editor-control-identifiers/#toolbarcontrols +//备份 原始的 +//const toolbar = ['searchreplace bold italic underline strikethrough alignleft aligncenter alignright outdent indent blockquote undo redo removeformat subscript superscript code codesample', 'hr bullist numlist link image charmap preview anchor pagebreak insertdatetime media table emoticons forecolor backcolor fullscreen'] +const toolbar = ['searchreplace bold italic underline strikethrough alignleft aligncenter alignright outdent indent blockquote undo redo codesample fullscreen', 'hr bullist numlist link image charmap anchor table emoticons forecolor backcolor preview code'] + +export default toolbar diff --git a/ruoyi-ui/src/views/bookmark/common/NqQuillEdit.vue b/ruoyi-ui/src/views/bookmark/common/NqQuillEdit.vue index 86e162572..da3fcedd4 100644 --- a/ruoyi-ui/src/views/bookmark/common/NqQuillEdit.vue +++ b/ruoyi-ui/src/views/bookmark/common/NqQuillEdit.vue @@ -1,53 +1,68 @@ - - - -