import React, { Fragment } from 'react'; import { Button, Card, DatePicker, Divider, Table, Form, Row, Col, Input, InputNumber, message, Modal, Select, Popconfirm, Tooltip, Spin } from 'antd'; import { connect } from 'dva'; import PageHeaderWrapper from './PageHeaderWrapper'; import styles from './TableList.less'; import StandardTable from './StandardTable'; import moment from 'moment'; import router from 'umi/router'; import ExportInfo from '../../App/ExportInfo'; import ExportCurrentInfo from '../../App/ExportCurrentInfo'; import StatisticsInfo from '../../App/StatisticsInfo'; import ImportUtil from '../../App/ImportUtil'; import SearchInfo from '../../App/SearchInfo'; import {Base16Encode} from "../../Base16/index"; import baseX from 'base-x' import {isEmpty} from 'lodash' const BASE16 = '0123456789abcdef' const bs16 = baseX(BASE16) const FormItem = Form.Item; let AllWidth = 0; // 表格总长度 const { RangePicker } = DatePicker; const text = [ 'BINARY', 'BIT', 'BLOB', 'CHAR', 'GEOMETRY', 'GEOMETRYCOLLECTION', 'JSON', 'LINESTRING', 'LONGBLOB', 'LONGTEXT', 'MEDIUMBLOB', 'MEDIUMINT', 'MEDIUMTEXT', 'MULTILINESTRING', 'MULTIPOINT', 'MULTIPOLYGON', 'POINT', 'POLYGON', 'REAL', 'DECIMAL', 'ENUM', 'SET', 'TEXT', 'TINYBLOB', 'TIBYTEXT', 'VARBINARY', 'VARCHAR', ]; const number = ['BIGINT', 'DOUBLE', 'FLOAT', 'INT', 'INTEGER', 'NUMERIC', 'SMALLINT', 'TINYINT']; const data = ['DATE', 'DATETIME', 'TIME', 'TIMESTAMP', 'YEAR']; const CreateForm = Form.create()(props => { const { modalVisible, form, handleAdd, formLoading, formData, isAdd, handleModalVisible, formItem, getItem, isView } = props; //通过回调 const okHandle = () => { form.validateFields((err, fieldsValue) => { if (err) return; if(isView){ handleModalVisible(); return; } formItem.map((item, index) => { if (item.type.indexOf('DATE') > -1) { for (let d in fieldsValue) { if (item.name === d&&fieldsValue[d]) { fieldsValue[d] = fieldsValue[d].format('YYYY-MM-DD HH:mm:ss'); } } } }); let params = { ...fieldsValue }; handleAdd(params, isAdd); }); }; console.log("isView",isView) //需要获取动态表单 return ( <Modal width="700px" maskClosable={false} destroyOnClose title={isView?"查看详情":(isAdd ? '新增' : '编辑')} visible={modalVisible} footer={isView?null:[ <Button key="back" onClick={() => handleModalVisible()}> 取消 </Button>, <Button key="submit" type="primary" onClick={okHandle}> 确定 </Button> ]} onOk={okHandle} onCancel={() => handleModalVisible()} > {formItem.map((item, index) => getItem(false,form, item, isAdd, formData, { span: 5 }, { span: 15 }))} </Modal> ); }); @connect(({ formList, loading }) => ({ formList, loading: loading.models.formList, })) @Form.create() class FormList extends React.Component { state = { data: { list: [], pagination: {}, }, selects:[], modalVisible: false, formData: null, formValues: {}, formItem: [], objId: this.props.objId || (this.props.location?this.props.location.state.id:null), isAdd: false, querys: [], selectedRows: [], primaryKey: null, options: {}, isTable: true, tableWidth:500, rights:this.props.rights||[], columnRights:[], isReady:false, groups:{}, showDiv:'', showMobileDiv:'', isView:false }; columns = []; getOptions = () => { const refIds = [] for (var i = 0; i < this.state.formItem.length; i++) { if (this.state.formItem[i].referenceObjId != null && this.state.options[this.state.formItem[i].id + ''] == null) { refIds.push(datas[t].id) } } if (refIds.length > 0) { dispatch({ type: 'formList/getBatchOptions', payload: { ids: refIds }, callback: (options) => { this.setState({ options: { ...this.state.options, ...options } }) } }); } } modify = record => { // if (this.state.formItem.length < 10) { this.getOptions() this.setState({ formData: record, modalVisible: true, isAdd: false, isView:false }); // } else { // router.push({ // pathname: '/admin/ddl/dataObj/formEdit', // state: { // id: this.state.objId, // recordId: record[this.state.primaryKey], // recordKey: this.state.primaryKey, // isAdd: false, // isView:false // }, // }); // } }; view = record => { // if (this.state.formItem.length < 10) { this.getOptions() this.setState({ formData: record, modalVisible: true, isAdd: false, isView:true }); // } else { // router.push({ // pathname: '/admin/ddl/dataObj/formEdit', // state: { // id: this.state.objId, // recordId: record[this.state.primaryKey], // recordKey: this.state.primaryKey, // isAdd: false, // isView:true // }, // }); // } }; delete = record => { //找出主键 let Keys = {}; Keys[this.state.primaryKey] = record[this.state.primaryKey]; this.props.dispatch({ type: 'formList/delete', payload: { keys: JSON.stringify(Keys), objId: this.state.objId }, callback: () => { this.getPage(); }, }); }; viewProcess = record => { const {dispatch}= this.props; dispatch({ type: 'formList/getAppId', payload: { code: record.process_biz_key, }, callback: (data) => { router.push({pathname: '/portal/serviceCentre/getdetail',state: {id:data.id}}) }, }); }; /** * 宽度自适应函数 */ resize = (e) => { let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度 let showMobileDiv = scrollWidth-77 if(document.querySelector('#previewDiv')){ // 预览模式 this.setState({ showMobileDiv:document.querySelector('#previewDiv').clientWidth-77 }) } else { this.setState({ showMobileDiv, }) } } //渲染值 componentDidMount() { const { dispatch, isFormCom, isSelect, callback, valueName } = this.props; window.addEventListener('resize', this.resize); if(this.props.objCode){ const { dispatch, objCode,sql} = this.props; if(objCode==1||objCode=="1"){ this.initColumn(); }else{ dispatch({ type: 'DataObj/findByCode', payload: { objCode:this.props.objCode }, callback: dataObj => { this.setState({ objId: dataObj.id ,isTable: data.isTable},()=>{ dispatch({ type: 'DataRight/getUserRight', payload: { objId: this.state.objId }, callback: data => { if(!this.props.rights){ this.setState({ rights: data }); } dispatch({ type: 'DataRight/getUserColumnRight', payload: { objId: this.state.objId }, callback: data => { this.setState({ columnRights: data }); this.initColumn(); } }); } }); }); }, }); } }else{ dispatch({ type: 'formList/getObjDetail', payload: { id: this.state.objId }, callback: data => { this.setState({ isTable: data.isTable }); } }); dispatch({ type: 'DataRight/getUserRight', payload: { objId: this.state.objId }, callback: data => { if(!this.props.rights){ this.setState({ rights: data }); } dispatch({ type: 'DataRight/getUserColumnRight', payload: { objId: this.state.objId }, callback: data => { this.setState({ columnRights: data }); this.initColumn(); } }); } }); } } /** * 移除监听器 */ componentWillUnmount(){ window.removeEventListener('resize',this.resize); } custom=this.props.value?Base16Encode(JSON.stringify(this.props.value)):null componentWillReceiveProps(nextProps){ const b = nextProps.value||{} const a = this.props.value||{} if(JSON.stringify(a)!=JSON.stringify(b)){ const params = { pageNo: 1, pageSize: this.props.pageSize||10, query: JSON.stringify(this.state.formValues), }; this.custom=Base16Encode(JSON.stringify(b)) if(this.state.objId)this.getPage(params) } if(this.props.objCode=="1"||this.props.objCode==1){ const params = { pageNo: 1, pageSize: this.props.pageSize||10, query: JSON.stringify(this.state.formValues), }; this.columns=nextProps.value.columns if( nextProps.value.getPage){ this.getPage(params,null,nextProps.value.getPage); } } const x=nextProps.selects const y = this.props.selects if(JSON.stringify(x)!=JSON.stringify(y)){ this.setState({selects:x}) } } initColumn = () =>{ const { dispatch, isFormCom, isSelect, callback, valueName } = this.props; const {rights,columnRights} = this.state; if(this.props.value&&this.props.value.columns){ this.columns=this.props.value.columns this.getPage(); return } if(this.props.objCode==1||this.props.objCode=="1"){ }else{ dispatch({ type: 'formList/getHead', payload: { dataObjId: this.state.objId }, callback: datas => { const querys = [] const refIds = [] const groups ={}; if (datas) { this.state.formItem = datas; let i = 0; for (let t in datas) { if (datas[t].isPrimaryKey) this.state.primaryKey = datas[t].name; if(datas[t].isHidden){ continue } let column = {}; column.title = datas[t].title; column.dataIndex = datas[t].name; column.width = datas[t].width; if(i==0) column.fixed='left'; if(columnRights.length>0&&!columnRights.includes(datas[t].id)){ continue; } if (data.includes(datas[t].type)) { column.render =( val) =>{ if(val == null){ return val; } if(datas[t].dataFormatStrWeb!=null){ return moment(val).format(datas[t].dataFormatStrWeb); }else { return moment(val).format('YYYY-MM-DD HH:mm:ss'); } } }else if(datas[t].name.indexOf("process_status")>-1){ column.render=(val)=>val?(val==="0"?"审核通过":"审核未通过"):null }else { column.render=(val)=>val&&val.length>100? <Tooltip title={val} overlayStyle={{width:1000}}> <span style={{width:column.width||200,display:"block", wordBreak:"keep-all",whiteSpace:"nowrap", overflow:"hidden", textOverflow:"ellipsis"}}>{val}</span> </Tooltip>:val } this.setState({tableWidth:((datas.length-1)*200)}) this.columns.push(column); if (datas[t].isShowQuery) { querys.push(datas[t]) if (datas[t].referenceObjId != null) { refIds.push(datas[t].id) } if(datas[t].isGroupQuery!=null){ dispatch({ type: 'formList/getGroupList', payload: { columnId: datas[t].id }, callback: (gourp) => { groups[datas[t].id] = gourp; this.setState({ groups }) } }); } } i++; } if (querys.length > 0) { this.setState({ querys }) if (refIds.length > 0) { dispatch({ type: 'formList/getBatchOptions', payload: { ids: refIds }, callback: (options) => { this.setState({ options }) } }); } } this.getPage(); } }, }); } } sqlBs16=Base16Encode(this.props.sql) getPage = (params, values,callPage) => { if(this.columns==null||this.columns.length==0){ return; } const { dispatch } = this.props; const pagination = this.state.data.pagination; if (params == null) { params = { pageNo: pagination.current ? pagination.current : 1, pageSize: pagination.pageSize ? pagination.pageSize : (this.props.pageSize||10), query: JSON.stringify(values!=null?values:this.state.formValues), }; } if(this.props.objCode&&(this.props.objCode=="1"||this.props.objCode==1)){ if(callPage){ callPage(params,(data)=>{ if(!this.state.isReady){ this.setState({data,isReady:true}) }else{ this.setState({data}) } }) }else if(this.props.value&&this.props.value.getPage){ this.props.value.getPage(params,(data)=>{ if(!this.state.isReady){ this.setState({data,isReady:true}) }else{ this.setState({data}) } }) } }else{ dispatch({ type: 'formList/fetch', payload: { custom:this.custom, ...params, sql:this.sqlBs16, dataObjId: this.state.objId, }, callback:(data)=>{ if(!this.state.isReady){ this.setState({data,isReady:true}) }else{ this.setState({data}) } } }); } }; handleStandardTableChange = (pagination, filtersArg, sorter) => { const filters = Object.keys(filtersArg) .reduce((obj, key) => { const newObj = { ...obj }; newObj[key] = getValue(filtersArg[key]); return newObj; }, {}); const params = { pageNo: pagination.current, pageSize: pagination.pageSize, ...filters, query: JSON.stringify(this.state.formValues), }; if (sorter.field) { params.sorter = `${sorter.field}_${sorter.order}`; } this.getPage(params); }; handleAdd = (fields, isAdd) => { let params = { ...fields, }; this.props.dispatch({ type: 'formList/add', payload: { params: params, objId: this.state.objId, isAdd: isAdd, isSelf: true, isView:false }, callback: () => { message.success('操作成功'); this.setState({ modalVisible: false, }); this.getPage(); }, }); }; handleModalVisible = () => { this.setState({ modalVisible: this.state.modalVisible ? false : true, formData: {}, }); }; add = () => { // if (this.state.formItem.length < 10) { this.getOptions() this.setState({ modalVisible: true, formData: {}, isAdd: true, isView:false }); // } else { // router.push({ // pathname: '/admin/ddl/dataObj/formEdit', // state: { id: this.state.objId,isAdd: true,isView:false } // }); // } }; handleSelectRows = rows => { this.setState({ selectedRows: rows, }); }; batchDelete = e => { const { dispatch } = this.props; const { selectedRows } = this.state; if (!selectedRows) return; let columns = this.state.formItem; let Keys = {}; for (let i in columns) { if (columns[i].isPrimaryKey) { //key Keys[columns[i].name] = selectedRows.map(row => row[columns[i].name]) .join(','); } } this.props.dispatch({ type: 'formList/delete', payload: { keys: JSON.stringify(Keys), objId: this.state.objId, isSelf: true }, callback: () => { this.setState({ selectedRows: [], }); this.getPage(); }, }); }; goBack = () => { router.goBack(); }; handleSearch = (e) => { e.preventDefault(); const { dispatch, form } = this.props; const {formValues} = this.state; form.validateFields((err, fieldsValue) => { if (err) return; const formItem = this.state.formItem formItem.map((item, index) => { if (item.type.indexOf('DATE') > -1) { for (let d in fieldsValue) { if (item.name === d && fieldsValue[d]) { if(fieldsValue[d]!=null&&fieldsValue[d].length>0){ fieldsValue[d]=[fieldsValue[d][0].format('YYYY-MM-DD HH:mm:ss'),fieldsValue[d][1].format('YYYY-MM-DD HH:mm:ss')]; }else { fieldsValue[d]=""; } } } } }); const values = { ...this.state.formValues, ...fieldsValue }; this.setState({ formValues: fieldsValue, }); this.getPage(null, values) }); } hanldeHighSearch=(e)=>{ const pagination = this.props.formList.data.pagination; let params = { pageNo: pagination.current ? pagination.current : 1, pageSize: pagination.pageSize ? pagination.pageSize : (this.props.pageSize||10), ...e } this.setState({formValues:{...e,...this.state.formValues}}) this.getPage(params) } handleFormReset = () => { const { form, dispatch } = this.props; form.resetFields(); this.setState({ formValues: {}, }, () => { this.getPage() }); } getItem = (isQuery,form, item, isAdd, formData, labelCol, wrapperCol) => { const {groups} =this.state; if (item.isPrimaryKey) { if (isAdd) { return (<></>); } else { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Input style={{ width: '70%' }} readOnly={!isAdd} placeholder="请输入"/>)} </FormItem> ); } } else if (item.referenceObjId != null) { const { options } = this.state const ops = options[item.id + ''] || [] return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Select style={{ width: '70%' }} placeholder="请选择" allowClear> {ops.map((r) => <Option value={r[item.referenceCodeName]} key={r[item.referenceCodeName]}>{r[item.referenceNameName]}</Option>)} </Select>)} </FormItem> ); }else if(item.name.indexOf("process_status")>-1){ return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Select style={{ width: '70%' }} placeholder="请选择" allowClear> <Option value={'0'} key={'0'}>审核通过</Option> <Option value={'2'} key={'2'}>审核未通过</Option> </Select>)} </FormItem> ); } else if(isQuery&&item.isGroupQuery!=null&&item.isGroupQuery){ //如果是查询 并且是组合查询 const ops = groups[item.id + ''] || [] return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Select style={{ width: '70%' }} placeholder="请选择" allowClear> {ops.map((r) => <Option value={r.value} key={r.value}>{r.value}</Option>)} </Select>)} </FormItem> ); } else if (text.indexOf(item.type) > -1) { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Input style={{ width: '70%' }} placeholder="请输入"/>)} </FormItem> ); } else if (number.indexOf(item.type) > -1) { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<InputNumber placeholder="请输入" min={0}/>)} </FormItem> ); } else if (isQuery&&data.indexOf(item.type) > -1) { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? null : moment(formData[item.name]), rules: [{ required: !item.isNull }], })( <RangePicker format={item.dataFormatStrWeb==null?"YYYY-MM-DD HH:mm:ss":item.dataFormatStrWeb} style={{ width: '95%' }} />)} </FormItem> ); }else if (data.indexOf(item.type) > -1) { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? moment() :(formData[item.name]?moment(formData[item.name]):null), rules: [{ required: !item.isNull }], })( <DatePicker format={item.dataFormatStrWeb==null?"YYYY-MM-DD HH:mm:ss":item.dataFormatStrWeb} style={{ width: '100%' }} placeholder="请输入" />, )} </FormItem> ); } else { return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }], })(<Input style={{ width: '70%' }} placeholder="请输入"/>)} </FormItem> ); } } renderForm() { const { form, } = this.props; const { querys } = this.state if (querys.length == 0) { return ''; } return ( <Form layout="inline"> <Row > {querys.map((item) => <Col style={{height:58}} span={8} key={item.id}> {this.getItem(true,form, { ...item, isNull: true }, true)} </Col> )} <Col span={8} > <span className={styles.submitButtons}> <Button type="primary" loading={this.props.loading} onClick={this.handleSearch}> 查询 </Button> <Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}> 重置 </Button> {/* <a style={{ marginLeft: 8 }} onClick={this.toggleForm}> 展开 <Icon type="down" /> </a> */} </span> </Col> </Row> </Form> ); } render() { const { modalVisible, selectedRows, querys,tableWidth,rights ,data,isReady} = this.state; if(!isReady){ return <div style={{width:20,margin:"auto"}}><Spin/></div> } const { isFormCom, isSelect, callback, valueName, notShowBack, istableCom, // 是否有模板设计器调用 } = this.props; const { showMobileDiv, isView } = this.state let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度 let isMobile = scrollWidth < 1200 if(document.querySelector('#previewDiv')){ isMobile = true } let showDiv = document.querySelector('#mobelDiv')&&document.querySelector('#mobelDiv')?.parentNode.clientWidth const parentMethods = { handleAdd: this.handleAdd, handleModalVisible: this.handleModalVisible, formData: this.state.formData, formItem: this.state.formItem, isAdd: this.state.isAdd, getItem: this.getItem, isView:isView, }; if(!isSelect&&!rights.includes('edit')&&!rights.includes('delete')&&!rights.includes("view")){ const column = { title: '操作', fixed: 'right', width: 150, render: (text, record) => { return <Fragment> <div > {record.process_biz_key?<><a onClick={this.view.bind(this, record)}>查看详情</a></>:''} </div> </Fragment> } } if(this.columns.length>0&&this.columns[this.columns.length-1].title=="操作"){ this.columns[this.columns.length-1]=column; } }else{ let width=0; if(rights && rights.includes('view')){ width=width+75; } if(rights && rights.includes('edit')){ width=width+40; } if(rights && rights.includes('delete')){ width=width+40; } const column = { title: '操作', fixed: 'right', width: width, render: (text, record) => { return <Fragment> <div style={{textAlign:'center'}}> {isSelect ? this.state.selects.includes(record[valueName]) ? <><span>已选择</span><Divider type="vertical"/></> : <><a onClick={callback.bind(this, record, this.columns)}>选择</a><Divider type="vertical"/></> : ''} {rights && !rights.includes('view') ? '' : <><a onClick={this.view.bind(this, record)}>查看详情</a><Divider type="vertical"/></>} {rights && !rights.includes('edit') ? '' : <><a onClick={this.modify.bind(this, record)}>编辑</a><Divider type="vertical"/></>} {record.process_biz_key?<><a onClick={this.viewProcess.bind(this, record)}>查看流程详情</a><Divider type="vertical"/></>:''} {rights && !rights.includes('delete') ? '' : <> <Popconfirm title="确定删除该数据?" onConfirm={this.delete.bind(this, record)} okText="确定" cancelText="取消" > <a>删除</a> </Popconfirm></>} </div> </Fragment> } } if(this.columns.length>0&&this.columns[this.columns.length-1].title=="操作"){ this.columns[this.columns.length-1]=column; }else{ this.columns.push(column); } } if(this.columns){ /** * 计算总长度 */ AllWidth = 0 this.columns = this.columns.map((item,index) => { if(isEmpty(item)){ return item } if(index === this.columns.length-1&&this.columns[this.columns.length-1].title !== '操作'){ AllWidth+=150 item.width = '' return item } let width = item.width?item.width:150 if(!item.width){ item.width = 150 } AllWidth += width return item }) if(!isEmpty(this.columns[this.columns.length-1]) &&this.columns[this.columns.length-1].title === '操作' ){ this.columns[this.columns.length-2].width = '' AllWidth+=100 } } const xxxx = <><Card bordered={false} bodyStyle={{padding:0}}> <div className={styles.tableList}> <div className={styles.tableListForm}>{this.renderForm()}</div> <div className={styles.tableListOperator}> {notShowBack ? notShowBack : <Button icon="rollback" type="primary" onClick={this.goBack}> 返回 </Button>} {rights && !rights.includes('add') ? '' : <Button icon="plus" type="primary" onClick={this.add}> 新建 </Button>} {rights && !rights.includes('searchData') ? '' :<SearchInfo hanldeHighSearch={this.hanldeHighSearch} objId = {this.state.objId}/>} {rights && !rights.includes('importData') ? '' : <ImportUtil objId={this.state.objId}/>} {rights && !rights.includes('exportCurrent') ? '' : <ExportCurrentInfo objId={this.state.objId} query={JSON.stringify(this.state.formValues)} custom={this.props.value?Base16Encode(JSON.stringify(this.props.value)):null} sql={Base16Encode(this.props.sql)} />} {rights && !rights.includes('exportData') ? '' : <ExportInfo objId={this.state.objId}/>} {rights && !rights.includes('statistics') ? '' : <StatisticsInfo objId={this.state.objId}/>} {rights && !rights.includes('delete') ? '' : selectedRows.length > 0 && ( <span> <Popconfirm title="确定删除该数据?" onConfirm={this.batchDelete} okText="确定" cancelText="取消" > <Button>批量删除</Button></Popconfirm> </span> )} </div> { (!istableCom)||(this.props.value&&this.props.value.columns)? <StandardTable showHeader={this.props.showHeader!=null?this.props.showHeader:true} noSelectRow={rights==null|| !rights.includes('delete') } rowKey="id" data={data} isHiddenPage={this.props.isHiddenPage!=null?this.props.isHiddenPage:false} columns={this.columns} scroll={this.props.value&&this.props.value.columns?{}:{ x: AllWidth }} selectedRows={selectedRows} onSelectRow={this.handleSelectRows} onChange={this.handleStandardTableChange} loading={this.props.loading} /> : <div id='mobelDiv' style={{ overflow:'hidden', width: isMobile?showMobileDiv:showDiv, height: '100%' }} > <div > { showDiv&&<StandardTable showHeader={this.props.showHeader!=null?this.props.showHeader:true} noSelectRow={rights==null|| !rights.includes('delete') } rowKey="id" data={data} columns={this.columns} scroll={this.props.value&&this.props.value.columns?{}:{ x: AllWidth }} selectedRows={selectedRows} isHiddenPage={this.props.isHiddenPage!=null?this.props.isHiddenPage:false} onSelectRow={this.handleSelectRows} onChange={this.handleStandardTableChange} loading={this.props.loading} /> } </div> </div> } </div> </Card> <CreateForm {...parentMethods} modalVisible={modalVisible}/></> if (isFormCom) { return xxxx } return ( <PageHeaderWrapper title=""> {xxxx} </PageHeaderWrapper> ); } } export default FormList;