# UI组件库

# 概述

组件库基于element-ui进行了封装,可以替代element-ui组件库。 提供了丰富的组件,包括基础通用组件、地图组件、可视化组件,在封装基础通用组件过程中对element组件样式进行了改写提供了一套默认样式,对通用组件增加了属性和功能并新增了组件

# 已封装组件

  • Button
  • Input
  • Radio
  • Checkbox
  • Switch
  • Select
  • Cascader
  • Pagination
  • SimplePagination
  • Sidebar
  • TimePicker
  • Dialog
  • Tag
  • Steps
  • Slider
  • Tabs
  • Message
  • Popover
  • FeedbackDialog
  • MessageBox
  • CitySelect
  • PlaceEditor
  • MultipleLine
  • GeneralBar
  • RatioPie
  • RatioBar

# 使用

安装依赖

tnpm install --save-dev @tencent/tlbs-ui

项目中引用

import Vue from 'vue';
import TlbsUI from '@tencent/tlbs-ui';
import '@tencent/tlbs-ui/index.css';

Vue.use(TlbsUI);

# 增加的属性和功能

# Cascader组件

优化了任意选择子节点的样式,将原有的需要点击单选框按钮选中,改为了去掉单选按钮并点击本行选项就能选中

# Dialog组件

参数 说明 类型 可选值 默认值
title-icon 头部title图标,取值success、warn、error string

# Tag组件

参数 说明 类型 可选值 默认值
disabled 是否禁用状态 boolean ---- false
background 背景色 string ---- ----

# Popover组件

参数 说明 类型 可选值 默认值
icon 标题字体图标 String

# Button组件

参数 说明 类型 可选值 默认值
square 是否方形按钮 boolean false
ghost 幽灵属性,使按钮背景透明 boolean false

# Input组件

参数 说明 类型 可选值 默认值
status 类型 string primary / success / warning / danger

# Radio组件

参数 说明 类型 可选值 默认值
type 类型 string primary / success / warning / danger

# Checkbox组件

参数 说明 类型 可选值 默认值
type 类型 string primary / success / warning / danger

# Switch组件

参数 说明 类型 可选值 默认值
type 类型 string primary / success / warning / danger

# 新增组件

  1. SimplePagination 简单分页组件
  2. Sidebar 侧边栏组件
  3. FeedbackDialog 反馈组件
  4. CitySelect 城市选择器
  5. PlaceEditor 地点编辑器组件
  6. MultipleLine 图表组件
  7. GeneralBar 图表组件
  8. RatioPie 比例饼图组件
  9. RatioBar 比例柱状图