Appearance
三、框架其他组件
1. z-dict:字典组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| label | 按钮显示名称 | String | - | - |
| code | 字典编码 | String | - | - |
| type | 图标尺寸 | Enum | select | select/radiobox/checkbox/text |
| rules | 表单验证规则 | Array | - | - |
| v-model | 字典值 | Any | - | - |
| readonly | 是否只读 | Boolean | - | - |
| default | 默认值 | Any | - | - |
| multiple | 是否多选 | Boolean | - | - |
2. z-user:用户组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| v-model | 用户 Uid 值 | String/Array | - | - |
| value | 用户 ID,无线版属性 | String | - | - |
| multiple | 是否多选 | Boolean | - | - |
| readonly | 是否只读 | Boolean | - | - |
| placeholder | 输入提示 | String | 请输入关键字搜索用户 | - |
3. z-icon: 跨端图标组件
-- 图标详情:https://b.ebus.vip/zeto/resource.html -- 支持 hover 样式
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| tooltip | 气泡提示内容,无线不支持 | String | - | - |
| width | 线条宽度 | Number | 1.5 | - |
| size | 图标大小 | Number | 16 | - |
| color | 自定义颜色 | color | - | - |
| type | 图标样式 | Enum | - | primary |success|warning|error|danger |
| badge | 徽标数字 | Number | - | number|dot - |
4. z-text 文本组件
组件属性:
- 继承自 el-text 组件,支持 type,size 等属性
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| v-model | 文本内容 | String | - | - |
| depend | 依赖表 | String | - | - |
| app | 依赖表 | String | 默认当前应用 | - |
| emit | 全局总线事件名称 | String | - | - |
| options | 选项值 | Array | - | - |
5. z-copy:复制组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| value | 复制的值 | String | - | - |
| label | 显示名称 | String | 默认取 value 值 | - |
| type | 按钮类型,参考 el-button/van-button 的 type 属性 | String | - | - |
组件插槽:
- 支持 default 插槽
6. z-date:日期格式化组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| value | 时间戳|ObjectId | Number|String | - | - |
| plain | 是否简易模式 | Boolean | false | - |
| span | 时间正负偏移,单位秒 | Number | - | - |
7. z-image 图片上传组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| v-model | 图片地址 | String/Array | - | - |
| mode | 是否公开图片 | String | public | public/private |
| limit | 限制上传个数 | Number | 6 | - |
| readonly | 是否只读 | Boolean | - | - |
| autoPreview | 自动启用预览 | Boolean | true | - |
8. z-avatar 用户头像组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| value | 用户 ID | String | - | - |
| plain | 只显示头像 | Boolean | true | - |
| size | 图像尺寸 | String | 24px | - |
9. z-qr:二维码组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| value | 二维码内容 | String | - | - |
| width | 显示宽度 | String | 160px | - |
| height | 显示高度 | String | 160px | - |
10. z-editor: 福文本编辑器
-- 基于 tiptap 封装,需要在lib中引入js文件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| v-model | 编辑器内容 | String | - | - |
| width | 宽度 | String | 100% | - |
| height | 高度 | String | 480px | - |
| mode | 显示样式 | normal|word|mini|group | normal | - |
| plugins | 自定义插件 | Array | 参考合同插件 | - |
| output | 输出格式 | html|json|md | 内容输出格式 | - |
11. z-address 地域选择器组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| v-model | 用户 Uid 值 | String/Array | - | - |
| multiple | 是否多选 | Boolean | - | - |
| readonly | 是否只读 | Boolean | - | - |
| strictly | 严格级联 | Boolean | true | - |
| placeholder | 输入提示 | String | 请输入关键字搜索用户 | - |
12. z-money 金额组件
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| modelValue | 金额值,单位分 | String/Number | - | - |
13. z-chart:图表组件
-- 底层基于 echart 封装,https://echarts.apache.org/zh/index.html
组件属性:
| 属性名 | 说明 | 类型 | 默认值 | 枚举值 |
|---|---|---|---|---|
| data | 图表数据 | Object | - | - |
| options | echart 配置选项 | Object | - | - |
| height | 图表高度 | String | 120px | - |