fh-cloud-ui-component

云平台前端UI组建库

添加组件流程

1./package目录下添加自定义组件，/package/theme-chalk/src目录下添加组件样式。

2. /package/index.js文件中引入组件模块，export模块。

4. 打包：npm run dist  说明：发包之前一定要重新打包

说明：组件库本身就是一个vue项目，npm run serve启动项目之后，得到fh-element-ui组件描述网站

组件库打包上传npm私服

1. 将本地C:\Users\Administrator\.npmrc 文件中的 registry 设置为 http://project.fhhcloud.com:8081/repository/npm-all/

2. npm私服账号：
    username: fhnpm;
    password: 123456;
    Email: [email protected];

3. 登录账号：npm login -registry=http://project.fhhcloud.com:8081/repository/npm-fhCloud/

4. 发包：npm publish
    说明：更新包是同样的命令，但是更新时需要更改版本号。不想更改版本号的，可以先撤销包，再发包；

5. 撤销：npm --force unpublish package_name -registry=http://project.fhhcloud.com:8081/repository/npm-fhCloud/
    说明：撤销的包不能立马再次发布；

组件说明

fh-button

在el-button的基础上添加权限管理；

Attributes:
per：当前用户在当前页面的权限值；

fh-gather

该组件展示左侧图标，右侧数值名称，数值；

Attributes：
span：组件比例，0-24之间；
data.icon：图标名称；
data.color: 图标和字体颜色值；
data.border：是否添加右侧边框；
data.count：展示数值；
data.title：标题名称；
 附：图标和字体颜色值，目前只接受colorFBBF2D，color2195F2，color00BCD4，color61C895，colorE3857F；
 
 Events:
 jumpTo：组件点击事件

fh-panel

信息面板，头部有标题和保存按钮

Attributes：
fhTitle：标题名称；
fhIf：保存按钮展示与否；

Events:
fhClick：与保存按钮绑定的点击事件；

fh-popover

hover浮动信息面板；

Attributes：
fieldName：列表名称；
fieldValue：列表数据；

fh-Header

头部样式和信息栏；

Attributes：
authorized：是否登录；
nickName：用户昵称；
userInfo: 用户信息;

Events:
handleShowDialog: 弹框显示函数;
logout: 退出登录函数;
changeTheme: 主题曲切换函数;
jumpTo: 登录跳转函数;

fh-Siderbar

侧边产品信息栏；

Attributes：
userInfo: 用户信息;
logoUrl: Logo的URL地址;
systemIcon: 当前产品的icon;

Events:
handleOpenTab: 产品访问函数;

fh-menu

菜单栏；
Attributes：
openeds: 当前展开项;
authMenu: 菜单详情;
activeMenuId: 选中页面的MenuId;
isCollapse: 菜单栏模块是否展开;
systemName: 当前产品名称;

Events:
jumpTo: 登录跳转函数;
handleCollapseMenu: 菜单栏模块的收缩控制函数

fh-tab2

一个简单tab标签组件，包含2个路由页面切换

Attributes：
leftPath   ： 第一个标签路由地址
leftLabel  ： 第一个标签显示名称
rightPath  ： 第二个标签路由地址
rightLabel ： 第二个标签显示名称
activeTab  ： 当前激活的标签【0：第一个，1：第二个】

Events：
toPath(path) 参数path:路由地址

fh-tag

基于element-ui的tag组件，只作了简单的样式修改，继承了el-tag所有的属性和方法