代码拉取完成,页面将自动刷新
Some Components are available now as below. Home
npm install --save ev-ui
first include your code in the EvUI
component
import {EvUI} from 'ev-ui'
render(){
return(
<EvUI>
your code
</EvUI>
)
}
Dialog
:Dialog.show(Comp)
or show comp with props:
import {Dialog} from 'ev-ui'
import {Comp} from 'comp.js'
const props={
content:Comp, //Component or string ,required
mainBlur:false,// the background where filter blur if
k1:{}, // any other props
k2:{}
}
Dialog.show(props)
ContextMenu
:import {ContextMenu,Menu,Item} from 'ev-ui'
export default class Demo extends React.Component{
/**
* first disable the default contextmenu
*/
componentDidMount(){
window.oncontextmenu=(e)=>{
e.preventDefault()
}
/**
* then bind the function to the node's onContextMenu event.
*/
onContextMenu(e){
let menu=new Menu()
.add(new MenuItem('新建',()=>{})
.add(new MenuItem('A',()=>{}))
.add(new MenuItem('B',()=>{}))
.add(new MenuItem('C',()=>{}))
)
.add(new MenuItem('编辑',()=>{}))
.add(new MenuItem('复制',()=>{}))
.add(new MenuItem('剪切',()=>{}))
// .add(new MenuItem('剪切',()=>{})).type('disabled') // the menuItem will be disabled(gray color and do nothing when clicked)
.add(new MenuItem('粘贴',()=>{}))
.add(new MenuItem('删除',()=>{}).type('remove'))
menu.notEmpty() && ContextMenu.show({menu,left:e.pageX,top:e.pageY})
}
render(){
return(
<div onContextMenu={this.onContextMenu.bind(this)}>demo</div>
)
}
}
Confirm
:import {Confirm} from 'ev-ui'
Confirm.show(()=>{
//called when you click confirm
},()=>{
// called when you click cancel
})
ActionTag
: import {ActionTag} from 'ev-ui'
//here use the Icon of the antd for demo,you can use others for example FontAwesome...
import {Icon} from 'antd'
render(){
return(
<div style={{display:flex,flexDirection:row,alignItems:center}}>
<ActionTag
iconField={<Icon type='plus'/>}
textField='Create'
onClick={()=>{}}
/>
{/* set the type*/}
<ActionTag
iconField={<Icon type='delete'/>}
textField='Remove'
type='danger'
onClick={()=>{}}
/>
{/* or set the size*/}
<ActionTag
iconField={<Icon type='edit'/>}
textField='Edit'
size='large'
onClick={()=>{}}
/>
</div>
)
}
Flow
:import {Flow} from 'ev-ui'
const data=[
{
id:'0',
name:'Flow0',
tasks:[
{point:0,name:'Task0',parent:[],children:[1]},
{point:1,name:'Task1',parent:[0],children:[2,3]},
{point:2,name:'Task2',parent:[1],children:[4]},
{point:3,name:'Task3',parent:[1],children:[4]},
{point:4,name:'Task4',parent:[2,3],children:[]},
]
},
{
id:'1',
name:'Flow1',
tasks:[
{point:0,name:'Task0',parent:[],children:[1]},
{point:1,name:'Task1',parent:[0],children:[2]},
{point:2,name:'Task2',parent:[1],children:[3]},
{point:3,name:'Task3',parent:[2],children:[4]},
{point:4,name:'Task4',parent:[3],children:[]},
]
}
]
export default class Process extends React.Component{
state={
processes:data,
selectedProcess:{}
}
onTaskChange(tasks){
//update the tasks
}
onCreate(){
//create process
}
render(){
return(
<div className='left-nav'>
{/* show the processes list */}
</div>
<div className='content'>
<Flow tasks={this.state.selectedProcess.tasks}
onChange={this.onTasksChange.bind(this)}
onFlowCreate={this.onCreate.bind(this)}
selectedProcess={this.state.selectedProcess || {}}/>
</div>
)
}
}
The document will be added later.
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型