VTAP 是 Vtiger 的低代码平台，可帮助开发人员和管理员扩展 CRM 的功能。 我们有两个工具可以提供构建低代码应用程序的能力。
一个是模块设计器，另一个是 API 设计器。 在此博客中，我们将讨论使用模块设计器的内容、方式和时间。
模块设计器
何时使用模块设计器（用例）
您可以使用模块设计器来：
- 应用复杂的公式并更新字段
- 当用户输入错误信息时闪烁警告
- 保存一些用户首选项
- 保存扩展设置或配置数据
- 添加按钮、小部件和图标
模块设计器为您提供什么来实现上述目标？
- 集成开发环境 (IDE)，您可以在其中编写逻辑和自定义代码
- VTAP Javascript API
如何使用模块设计器？
模块设计器位于主菜单 > 平台应用程序下。 它对所有专业和企业客户都是免费的。 如果你想开发和发布扩展到市场，你可以从 此处.
您可以使用模块设计器添加以下内容：
- VTAP 脚本 – 允许您添加自定义按钮、小部件等。
- 组件 - 允许您添加自定义组件。
- VTAP 样式 - 帮助您更改 UI 的外观和感觉。
- 页面 - 允许您添加自定义页面。
在本博客中，我们将讨论如何将 VTAP 脚本添加到模块设计器。
添加 VTAP 脚本
VTAP 脚本是自定义逻辑的入口点。 您首先为脚本命名并选择脚本应该运行的模块。 选择模块很重要，因为您经常有特定于模块的需求，例如收听联系人的按钮单击或记录保存。
您可以选择创建自定义扩展模块或使用现有模块添加脚本。
请注意： 如果您希望通过 Vtiger 市场发布模块，请创建一个扩展模块。
现在让我们看几个使用 VTAP 脚本的示例。
例如1： 一个按钮已添加到潜在客户列表页面。 每个脚本都是使用此基本脚手架创建的，并为脚本选择了名称，如下所示。
VTAP 的基本构建块是一个组件，它基于 Vue 组件及其 生命周期事件.
- 组件名称： 线索_组件_注册
- 语法： {{MODULE}}_Component_{{NAME}}
- 组件扩展自： VTAP.Component.Core.扩展
主要工作内容
- 创建于 功能是 入口点 对于任何组件。 这是您可以注册按钮或监听事件的功能。
- 模板 是您添加 HTML（如果有）的地方。
- 方法 是您添加在模板 HTML 中调用的函数的地方。 在下面的示例中，我们在单击按钮时调用 ClickMe 函数。 这是最终代码的样子：
VTAP.组件.注册 API 可帮助您添加按钮、小部件、图标等。API 的第一个参数告诉您要添加自定义组件的位置。 要查看支持的组件列表，请单击 此处.
例如2： 将小部件添加到联系人和组织的摘要视图。
您可以使用一次注册在多个模块中添加相同的小部件。 在这种情况下，我们应该为所有模块添加 VTAP 脚本（在创建 VTAP 脚本时使用下拉菜单）。
对于 VTAP.Component.Register API，我们有第四个参数可帮助您选择应添加小部件的模块。 这是它在组织摘要视图中的外观。
VTAP 还使您能够监听用户执行的操作。 例如，当用户创建或更新记录、打开详细信息页面、显示编辑弹出窗口等时。要查看此类触发事件的列表，请单击 此处.
您需要监听此类事件并添加一个处理程序来对它们执行操作。
以下是事件的示例 - 记录已保存。 此示例将在保存记录时检查联系人的联系人状态。 如果联系人状态是竞争对手，将显示一条通知，提示“小心！！”。
同样，VTAP 平台提供了各种 UI 挂钩来插入您的自定义组件，例如列表/详细信息页面中的按钮、摘要视图中的小部件和图标。
对于提供的所有不同占位符，请参阅我们的详细信息 文件.
在我们即将发布的博客中，我们将介绍 VTAP 的其他功能——自定义组件、VTAP 和自定义页面。
我强烈建议您编写自己的代码。 使用自定义按钮从小处开始，然后从那里开始。 使用我们的模块设计器 例子，在我们的文档中提供，作为您的第一个代码的基础。 您会发现定制您的 CRM 是一个简单有趣的过程。
