@beisen/guide

guide 使用说明

项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. npm run build （生产环境打包）

guide参数

	{
		list:[
			{
				id:0  //非必须
				,text:"同步入离职"  //节点显示文字
				,status:"done"    //节点显示状态， "done"- 已完成， "doing"-当前步骤，"todo"-未开始
				,isChecked:false  //选中当前节点
				,disabled:false   //该节点是否被禁用
			}
		]
		,minScroll: 50 //当出现滚动条后，点击按钮时滚动距离，默认50px
		,onClick: (val) => {console.info(val)} //节点的点击事件，会将相应节点数据抛出
	}

视图页隐藏头部参数

	
	hidePageHeader=1(或true) ,//根据url中参数判断是否显示头部，hidePageHeader=任意值则隐藏视图页头部
	前端在url中加入该参数来隐藏视图页头部

guide调用方法

1.安装npm组件包

npm install @beisen/guide --save-dev

2.引用组件

import Guide from "@beisen/guide"

3. 传入参数

   该参数为上述参数，传入方式使用: {...参数}

   const data = {
   			list:[
   				{
   					id:0
   					,text:"同步入离职"
   					,status:"done"
   					,isChecked:false
   					,disabled:false
   				},
   				{
   					id:1
   					,text:"计算"
   					,status:"done"
   					,isChecked:false
   					,disabled:false
   				},
   				{
   					id:2
   					,text:"差异分析"
   					,status:"doing"
   					,isChecked:true
   					,disabled:false
   				},
   				{
   					id:3
   					,text:"关联处理"
   					,status:"done"
   					,isChecked:false
   					,disabled:false
   				},
   				{
   					id:4
   					,text:"差异分析"
   					,status:"todo"
   					,isChecked:false
   					,disabled:true
   				}
   				,
   				{
   					id:5
   					,text:"差异分析"
   					,status:"todo"
   					,isChecked:false
   					,disabled:false
   				}
   				,
   				{
   					id:6
   					,text:"发布工资条"
   					,status:"todo"
   					,isChecked:false
   					,disabled:false
   				}
   			]
   			,minScroll: 50 //点击按钮时滚动距离，默认50px
   			,onClick: (val) => {console.info(val)}
   		}
   
   render () {
   		return (
   			<Guide {...data} />
   		)
   	}