tianheng-ui

tianheng-ui

• 在线预览
• 开发指南
• 更新日志
• 组件
  • WorkFlow 工作流（基于 bpmn-js 实现业务流程设计器，可自定义流程节点：指定人员、指定部门、直属领导、联系多级主管、发起人自选、发起人自己，可支持根据业务字段进行条件判断。）
  • CodeEditor 代码编辑器（基于 ace-builds 实现的代码编辑器）
  • VueEditor 富文本编辑器（基于 vue2-editor 实现的富文本编辑器）
  • FormMaking 表单设计器（基于可视化操作快速设计出表单页面）
  • FormGenerate 表单渲染器（根据设计器中获取的配置 json 数据，快速渲染出表单页面）
  • TableMaking 列表设计器（基于可视化操作快速设计出列表页面）
  • TableGenerate 列表渲染器（根据设计器中获取的配置 json 数据，快速渲染出列表页面）

FormMaking 特性

<!-- 表单设计器 -->
<th-form-making :config="formConfig"></th-form-making>
<!-- 表单渲染器 -->
<th-form-generate :config="formConfig" :value="formValue"></th-form-generate>

基于 vue 和 element-ui 实现的可视化表单设计器，使用了最新的前端技术栈，可以让表单开发简单而高效。

• 可视化配置页面
• 提供栅格布局，并采用 flex 实现对齐
• 提供布局容器，并且可以相互嵌套（栅格、表格、标签页）
• 一键预览配置的效果
• 一键生成配置 json 数据
• 一键生成代码，立即可运行
• 提供自定义组件满足用户自定义需求
• 提供远端数据接口，方便用户需要异步获取数据加载
• 提供动作事件，可以让表单更加灵活配置
• 提供功能强大的高级组件
• 提供多维数据设计，支持表单结果数据内链
• 支持表单验证
• 快速获取表单数据

更多介绍

Installation

npm install tianheng-ui

Quick Start

import TianhengUI from "tianheng-ui";
import 'tianheng-ui/lib/theme-chalk/index.scss';
Vue.use(TianhengUI);