tinymce.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219
  1. layui.define(['jquery'],function (exports) {
  2. var $ = layui.$
  3. var modFile = layui.cache.modules['tinymce'];
  4. var modPath = modFile.substr(0, modFile.lastIndexOf('.'))
  5. var setter = layui.setter || {}
  6. var response = setter.response || {}
  7. var plugin_filename = 'tinymce.min.js'//插件路径,不包含base_url部分
  8. var settings = {
  9. base_url: modPath
  10. , relative_urls: false
  11. , remove_script_host: true
  12. , images_upload_url: ''//图片上传接口,可在option传入,也可在这里修改,option的值优先
  13. , language: 'zh_CN'//语言,可在option传入,也可在这里修改,option的值优先
  14. , response: {//后台返回数据格式设置
  15. statusName: response.statusName || 'code'//返回状态字段
  16. , msgName: response.msgName || 'msg'//返回消息字段
  17. , dataName: response.dataName || 'data'//返回的数据
  18. , statusCode: response.statusCode || {
  19. ok: 0//数据正常
  20. }
  21. }
  22. , success: function (res, succFun, failFun) {//图片上传完成回调 根据自己需要修改
  23. if (res[this.response.statusName] == this.response.statusCode.ok) {
  24. succFun(res[this.response.dataName]["url"]);
  25. } else {
  26. failFun(res[this.response.msgName]["url"]);
  27. }
  28. }
  29. };
  30. // ---------------- 以下代码无需修改 ----------------
  31. var t = {};
  32. //初始化
  33. t.render = function (options,callback) {
  34. initTinymce();
  35. var option = initOptions(options,callback)
  36. ,edit = t.get(option.elem);
  37. if (edit) {
  38. edit.destroy();
  39. }
  40. tinymce.init(option);
  41. return t.get(option.elem);
  42. };
  43. t.init = t.render
  44. // 获取ID对应的编辑器对象
  45. t.get = function (elem) {
  46. initTinymce();
  47. if (elem && /^#|\./.test(elem)) {
  48. var id = elem.substr(1);
  49. var edit = tinymce.editors[id];
  50. return edit
  51. } else {
  52. return false;
  53. }
  54. }
  55. //重载
  56. t.reload = function (elem, option, callback) {
  57. var options = {}
  58. if(typeof elem == 'string'){
  59. option.elem = elem
  60. options = $.extend({}, option)
  61. } else if (typeof elem == 'object' && typeof elem.elem == 'string'){
  62. options = $.extend({}, elem)
  63. callback = option
  64. }
  65. var optionCache = layui.sessionData('layui-tinymce')[options.elem]
  66. delete optionCache.init_instance_callback
  67. $.extend(optionCache,options)
  68. return t.render(optionCache,callback)
  69. }
  70. function initOptions(option,callback) {
  71. var admin = layui.admin || {}
  72. var form = option.form || {}
  73. var file_field = form.name || 'edit' //文件字段名
  74. var form_data = form.data || {} //其他表单数据 {key:value, ...}
  75. option.suffix= isset(option.suffix) ? option.suffix : (plugin_filename.indexOf('.min')>-1 ? '.min' : '')
  76. option.base_url = isset(option.base_url) ? option.base_url : settings.base_url
  77. option.relative_urls = isset(option.relative_urls) ? option.relative_urls : settings.relative_urls
  78. option.remove_script_host = isset(option.remove_script_host) ? option.remove_script_host : settings.remove_script_host
  79. option.language = isset(option.language) ? option.language : settings.language
  80. option.selector = isset(option.selector) ? option.selector : option.elem
  81. option.quickbars_selection_toolbar = isset(option.quickbars_selection_toolbar) ? option.quickbars_selection_toolbar : 'cut copy | bold italic underline strikethrough '
  82. option.plugins = isset(option.plugins) ? option.plugins : 'code kityformula-editor quickbars print preview searchreplace autolink fullscreen image link media codesample table charmap hr advlist lists wordcount imagetools indent2em';
  83. option.toolbar = isset(option.toolbar) ? option.toolbar : 'code undo redo | kityformula-editor forecolor backcolor bold italic underline strikethrough | indent2em alignleft aligncenter alignright alignjustify outdent indent | link bullist numlist image table codesample | formatselect fontselect fontsizeselect';
  84. option.resize = isset(option.resize) ? option.resize : false;
  85. option.elementpath = isset(option.elementpath) ? option.elementpath : false;
  86. option.branding = isset(option.branding) ? option.branding : false;
  87. option.contextmenu_never_use_native = isset(option.contextmenu_never_use_native) ? option.contextmenu_never_use_native : true;
  88. option.menubar = isset(option.menubar) ? option.menubar : 'file edit insert format table';
  89. option.menu = isset(option.menu) ? option.menu : {
  90. file: {title: '文件', items: 'newdocument | print preview fullscreen | wordcount'},
  91. edit: {title: '编辑', items: 'undo redo | cut copy paste pastetext selectall | searchreplace'},
  92. format: {
  93. title: '格式',
  94. items: 'bold italic underline strikethrough superscript subscript | formats | forecolor backcolor | removeformat'
  95. },
  96. table: {title: '表格', items: 'inserttable tableprops deletetable | cell row column'},
  97. };
  98. option.init_instance_callback =isset(option.init_instance_callback) ? option.init_instance_callback : function(inst) {
  99. if(typeof callback == 'function') callback(option,inst)
  100. };
  101. option.images_upload_url = isset(option.images_upload_url) ? option.images_upload_url : settings.images_upload_url;
  102. option.images_upload_handler = isset(option.images_upload_handler) ? option.images_upload_handler : function(blobInfo, succFun, failFun) {
  103. if(isEmpty(option.images_upload_url)){
  104. failFun("上传接口未配置");
  105. return console.error('images_upload_url未配置');
  106. }
  107. var formData = new FormData();
  108. formData.append(file_field, blobInfo.blob());
  109. if(typeof form_data == 'object'){
  110. for(var key in form_data){
  111. formData.append(key, form_data[key]);
  112. }
  113. }
  114. var ajaxOpt = {
  115. url: option.images_upload_url,
  116. dataType: 'json',
  117. type: 'POST',
  118. data: formData,
  119. processData: false,
  120. contentType: false,
  121. success: function (res) {
  122. settings.success(res, succFun, failFun)
  123. },
  124. error: function (res) {
  125. failFun("网络错误:" + res.status);
  126. }
  127. };
  128. if (typeof admin.req == 'function') {
  129. admin.req(ajaxOpt);
  130. } else {
  131. $.ajax(ajaxOpt);
  132. }
  133. }
  134. layui.sessionData('layui-tinymce',{
  135. key:option.selector,
  136. value:option
  137. })
  138. return option
  139. }
  140. function initTinymce() {
  141. if (typeof tinymce == 'undefined') {
  142. $.ajax({//获取插件
  143. url: settings.base_url + '/' + plugin_filename,
  144. dataType: 'script',
  145. cache: true,
  146. async: false,
  147. });
  148. }
  149. }
  150. function isset(value) {
  151. return typeof value !== 'undefined' && value !== null
  152. }
  153. function isEmpty(value) {
  154. if(typeof value === 'undefined' || value === null|| value === ''){
  155. return true
  156. } else if (value instanceof Array && value.length === 0){
  157. return true
  158. } else if (typeof value === 'object' && Object.keys(value).length === 0){
  159. return true
  160. }
  161. return false
  162. }
  163. exports('tinymce', t);
  164. });