dag-pipeline

1.0.4 • Public • Published

Pipeline使用说明

1、在当前目录下执行:

$ npm link

2、在需要引用的项目中和node_modules同目录执行

$ npm link pipeline

3、使用 在组件中引入pipeline

import Pipeline from 'pipeline'

具体使用方法见src/app.js,或者参考http://gitlab.zhonganonline.com/project/learning/blob/menu/learning/src/containers/PipeTest.js

pipeline主要由6个配置项menuConfig,dagConfig,setNodeOptions、pipelinename、dblclickOnNode和toolbarConfig

menuConfig:左侧菜单栏的配置信息

menuConfig: {
          menu: [{                       //菜单栏配置(Array)
              key: 'home',               //菜单item的key(String)
              name: '主页',               //菜单item的显示名字(String)
              icon: 'ml-zhuanhuan',      //菜单item左侧显示的图标icon(String)
              link: '',                  //路由链接hash(String)
              childs: [{                 //子菜单配置项(Array)
                  key: '0001',
                  name: 'menu1',
                  icon: 'ml-zhuanhuan',
                  link: '',
                  draggable: true,      //是否可拖动
                  data:                 //用户需要存放的数据
              }]
          }],
          activeMenu: location.hash.replace('#/', ''),//正在被激活的item项
          style: { height: windowH - 94, flex: 'none' },//用户自定义style
          theme: 'white'    //主题色,目前有2种可选(default和white),默认为default
      },

dagConfig:右侧dag的配置信息

dagConfig: {
          global: {
              createdAt: new Date(),
              updatedAt: new Date(),
              view: {
                  center: [0, 0],
                  zoom: 0
              }
          },
          links: [],
          nodes: []
      },

setNodeOptions:在拖放后给节点设置option值方法

pipelinename:pipeline名称

dblclickOnNode:双击事件处理

toolbarConfig:顶部操作栏的配置

    toolbarConfig:{
        tools:{
            left: [{        //左侧操作按钮
                name: '删除',//按钮名称
                key: 'delete',//key值
                icon: 'ml-lajitong'//icon图标
            }, {
                name: '保存',
                key: 'save',
                icon: 'ml-baocun'
            }],
            right: ( 
                <RaisedButton label = "保存并提交" //右侧操作按钮(Element)
                    onClick = {
                        (e) => {
                            console.log(e)
                        }
                    }
                    primary = {
                        true
                    }
                \/>
            )
        },
        onClickTool:(key) => {console.log(key)}  //这里的key对应上面left中各个对象中的key
    }

Readme

Keywords

none

Package Sidebar

Install

npm i dag-pipeline

Weekly Downloads

2

Version

1.0.4

License

Apache-2.0

Unpacked Size

183 kB

Total Files

29

Last publish

Collaborators

  • fengbo
  • inverse