import React, { Component } from 'react'
import '@grapecity/wijmo.styles/wijmo.css';
import {FlexGrid,FlexGridColumn} from '@grapecity/wijmo.react.grid';
export default class Grid extends Component {
constructor(props){
super(props)
this.state={
data:[],
columns:[
{
binding:"name",
header:"名称",
width:220,
},
{
binding:"timer",
header:"编辑时间",
width:220,
},
]
}
}
beginningEdit=(s,e)=>{
let col=s.columns[e.col]
if(col.binding==="name"){
let item=s.rows[e.row].dataItem
if(!item?.newFlag){
e.cancel=true
}
}else{
e.cancel=true
}
}
cellEditEnded=(s,e)=>{
let item=s.rows[e.row].dataItem
if(item?.name===""){
this.setState({data:[]})
}
}
add=()=>{
this.setState({data:[
{
id:null,
name:"新建目录",
newFlag:"newBuild",
writeCategory:true
}
]})
}
handInit=(grid)=>{
this.grid=grid
grid.gotFocus.addHandler(()=>{
grid.startEditing(true)
})
}
handleFormatItem=(gridPanel,cellRange)=>{
const {rows,columns,cells}=gridPanel
const {cell,col,row,panel}=cellRange
if(cells===panel){
const column=columns[col]
let rowIndex=row
let dataItem=null
let newRowIndex=gridPanel._items.length-1
for(let i=0;i<gridPanel._items.length;i++){
const element=gridPanel._items
if(i===rowIndex){
dataItem=element
}
}
if(dataItem){
console.log(11,cell,dataItem,column,newRowIndex);
this.handleFormatCell(cell,dataItem,column,newRowIndex)
}
}
}
handleFormatCell=(cell,dataItem,col,newRowIndex)=>{
const {data}=this.state
if(col.binding==="name"){
if(dataItem?.newFlag){
this.grid.setCellData(data.length,"name",dataItem.name)
this.grid.select(newRowIndex,0)
this.grid.rows[newRowIndex].isSelected=true
this.grid.startEditing()
}else{
cell.innerHTMl=`<div>111${col.index}</div>`
}
}
}
render() {
const {columns}=this.state
return (
<>
{this.state.data.length>0&& <FlexGrid
cellEditEnded={this.cellEditEnded}
beginningEdit={this.beginningEdit}
initialized={this.handInit}
itemsSource={this.state.data}
formatItem={this.handleFormatItem}
>
{columns.map((column,index)=>(
< FlexGridColumn key={column?.binding||index} {...column}/>
))}
</FlexGrid>}
<button onClick={this.add}>新增目录</button>
</>
)
}
}
|
陕公网安备：61019002000258 |
隐私政策 |
网站地图