SuiteCRM添加自定义字段

第一步，添加自定义字段对应文件：

custom/modules/DynamicFields/templates/Fields/TemplateEditor.php

<?php
if(!defined('sugarEntry') || !sugarEntry) die('Not A Valid Entry Point');

require_once('modules/DynamicFields/templates/Fields/TemplateField.php');
class TemplateEditor extends TemplateField{
    var $type='Editor'; // 在后台模块管理中显示的数据类型值

    function get_field_def(){
        $def = parent::get_field_def();
        $def['dbType'] = 'text'; // 字段在数据表中的类型
        return $def;
    }
}

第二步，创建字段对应标题

新建如下文件：

custom/Extension/modules/ModuleBuilder/Ext/Language/zh_CN.Editor.php (en_us.Editor.php对应英文)

<?php
	$mod_strings['fieldTypes'][Editor] = 'HTML编辑器';

此时点击 “修复 / 快速修复并重建”，就可以在后台中显示对应字段。

第三步，定制不同字段类型对应的前台页面

新建该字段对应视图

custom/include/SugarFields/Fields/Editor/DetailView.tpl (详情)
custom/include/SugarFields/Fields/Editor/EditView.tpl (编辑)

<script src="custom/include/SugarFields/Fields/ColourPicker/js/jquery.min.js"></script>
<script type="text/javascript" src="lib/wangEditor-3.1.1/release/wangEditor.js"></script>
{if strlen({{sugarvar key='value' string=true}}) <= 0}
    {assign var="value" value={{sugarvar key='default_value' string=true}} }
{else}
    {assign var="value" value={{sugarvar key='value' string=true}} }
{/if}
<div name='{{if empty($displayParams.idName)}}{{sugarvar key='name'}}{{else}}{{$displayParams.idName}}{{/if}}' id='{{if empty($displayParams.idName)}}{{sugarvar key='name'}}{{else}}{{$displayParams.idName}}{{/if}}' style="width: 243%"></div>

<script>
    {literal}
    $(document).ready(function(){
        var E = window.wangEditor
        var editor = new E('#{/literal}{{if empty($displayParams.idName)}}{{sugarvar key='name'}}{{else}}{{$displayParams.idName}}{{/if}}{literal}')
        editor.create()
    });
    {/literal}
</script>

再次点击 “修复 / 快速修复并重建”，就可以在前台中显示你想要的效果了。

页面上编辑器显示后，试着在页面中写了，编辑器中的内容添加不到对应数据表字段中，这是因为wangeditor加载编辑器是用div标签，但是SuiteCRM是通过表单提交的数据，所以需要将编辑器中的内容实时记录到textarea中，wangeditor文档中提供了这样的方法，当然我做了一点修改，如下：

<div id="div1">
        <p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p>
    </div>
    <textarea id="text1" style="width:100%; height:200px;"></textarea>

    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="../wangEditor.js"></script>
    <script type="text/javascript">
        var E = window.wangEditor
        var editor = new E('#div1')
        var $text1 = $('#text1')
        editor.customConfig.onchange = function (html) {
            // 监控变化，同步更新到 textarea
            $text1.val(html)
        }
        editor.create()
        // 初始化 编辑器 的值
        editor.txt.html($text1.val());	// 为了让内容显示中编辑器中
    </script>

最后点击 “修复 / 快速修复并重建”，添加，更新等功能就可以正常使用了。