微擎函数tpl_ueditor之百度富文本编辑器
微擎函数tpl_ueditor是基于百度富文本编辑器（UEditor），微擎扩展其上传图片组件及上传视频组件，还修复了若干bug。
使用前请务必 load()->func('tpl'); 加载模板组件函数，并加载了系统的头部模板文件
tpl_ueditor组件函数源码
源码位置
w7/web/common/tpl.func.php
源码如下
function tpl_ueditor($id, $value = '', $options = array()) {
global $_W;
$options['uniacid'] = isset($options['uniacid']) ? intval($options['uniacid']) : $_W['uniacid'];
$options['global'] = empty($options['global']) ? '' : $options['global'];
$options['height'] = empty($options['height']) ? 200 : $options['height'];
$options['allow_upload_video'] = isset($options['allow_upload_video']) ? $options['allow_upload_video'] : true;
$s = '';
$s .= !empty($id) ? "<textarea id=\"{$id}\" name=\"{$id}\" type=\"text/plain\" style=\"height:{$options['height']}px;\">{$value}</textarea>" : '';
$s .= "
<script type=\"text/javascript\">
require(['util'], function(util){
util.editor('" . ($id ? $id : '') . "', {
uniacid : {$options['uniacid']},
global : '" . $options['global'] . "',
height : {$options['height']},
dest_dir : '" . ($options['dest_dir'] ? $options['dest_dir'] : '') . "',
image_limit : " . (intval($GLOBALS['_W']['setting']['upload']['image']['limit']) * 1024) . ',
allow_upload_video : ' . ($options['allow_upload_video'] ? 'true' : 'false') . ',
audio_limit : ' . (intval($GLOBALS['_W']['setting']['upload']['audio']['limit']) * 1024) . ",
callback : ''
});
});
</script>";
return $s;
}
源码注释
函数的三个参数
1、$id 生成富文本编辑器的名称，最终提交POST/GET也是通过此名称获取
//php 端取值 $_GPC['content']
2、$value 默认的文本内容
3、$options 编辑器参数配置数组，比如设置编辑器高度：
编辑器的高度：height 正整数，结尾不加px
下面简单的说一下调用富文本编辑器的几种方法。
模板文件调用组件函数
示例代码
{php echo tpl_ueditor('goodsdetail', $item['goodsdetail'], array('height'=>'200'))}
通过JS来调用
某些情况您可能不希望直接生成出来富文本编辑器，需要自己定义一些事件或是通过某些条件生成出来编辑器，可以选择这样的方式来调用，以下给出实例：
在Html页面上还需要调用一个组件函数，只不过是第一个参数传入空值，用于引用各种富文本编辑器的JS文件
{php echo tpl_ueditor('')}
<script type="text/javascript">
<!--
// ueditoroption 这个变量是微擎定义好的百度编辑器的初始化参数，直接使用即可
var editor = UE.getEditor('content', ueditoroption);
editor.addListener('contentChange', function() {
//此处增加了侦听编辑器内容变化的事件
//do something
});
editor.addListener('ready', function(){
//此处增加了侦听编辑器初始化的事件
//do something
});
//-->
</script>
实例1：更改插入视频上传大小
涉及文件
web\resource\components\fileuploader\fileuploader.min.js
代码如下
case "video":
i = "视频",
typeUnit = "个",
j = {
title: "Video",
extensions: "rm,rmvb,wmv,avi,mpg,mpeg,mp4",//针对上传视频扩展限制
mimeTypes: "video/*"
},
k = 30,//上传个数限制
l = 209715200,//单个文件大小是否超出限制
m = k * l,//文件总大小限制
n = !1,
o.options.isWechat && (k = 5, "temp" == o.options.mode ? (j.extensions = "mp4", l = 10485760, m = 52428800) : (l = 20971520, m = 104857600))
