apec-fe-components

> 1、打标签组件 2、动态表单 3、动态表单拖拽

Usage no npm install needed!

<script type="module">
  import apecFeComponents from 'https://cdn.skypack.dev/apec-fe-components';
</script>

README

apec-fe-components [业务组件：打标签插件、动态表单插件等]

1、打标签组件 2、动态表单 3、动态表单拖拽

source

http://git.ap-ec.cn/apec-fe/apec-fe-components.git

toDO

  1. 动态表单
  2. 动态表单元素拖拽排序

usage

npm install apec-fe-components

# main.js
import apecComponents from 'apec-fe-components'
import 'apec-fe-components/dist/apec-fe-components.css'

Vue.use(apecComponents, axios)

# vue e.g: 打标签组件
<apec-fe-label :options="{
  entityId: scope.row.roleId, // 实体ID
  entityName: scope.row.roleName, // 实体名称
  serviceName: 'JURISDICTION-SERVICE-MAGPIE', // 来源服务
  domainId: '', // 领域ID
  tagIds: [] // 标签ID集合
}" @onSave="save">打标签</apec-fe-label>

# vue e.g: 动态表单元素
<apec-fe-dynamic-item
  :width="450"
  :text-desc="item.attrDesc" // 文本描述
  :type="item.attrType" // 类型：TEXT、SELECT、CHECKBOX、RADIO
  :is-required="item.isRequired" // 是否必填
  :sel-list="item.selList" // 下拉列表
  :validate-json="item.validateJson || {}" // 校验规则
  @change="onChange"
/>

# vue e.g: 动态表单拖拽
<drag-form
  :data="data" // 单个表单的数据，数组类型
  @sort="onSort" // 排序方法，返回拖拽后的数组
/>

publish

  npm login
  Username: apec-fe
  Password: bi~
  Email: linjw@ap-ec.cn

  npm publish

others

https://www.yuque.com/apec/frontend/yhh1dh