| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | // import { is, fromJS } from 'immutable' |
| | | import { Button, Affix } from 'antd' |
| | | import { Button, Affix, Modal } from 'antd' |
| | | import './index.scss' |
| | | |
| | | const { confirm } = Modal |
| | | |
| | | class MainAction extends Component { |
| | | static propTpyes = { |
| | | actions: PropTypes.array, // 搜索条件列表 |
| | | dict: PropTypes.object // 字典项 |
| | | dict: PropTypes.object, // 字典项 |
| | | fixed: PropTypes.any |
| | | } |
| | | |
| | | state = { |
| | |
| | | } |
| | | |
| | | actionTrigger = (item) => { |
| | | console.log(item) |
| | | if (item.Action === 'Prompt' || item.Action === 'Delete') { |
| | | confirm({ |
| | | title: this.props.dict['main.action.confirm.tip'], |
| | | // content: 'Some descriptions', |
| | | onOk() { |
| | | return new Promise((resolve, reject) => { |
| | | setTimeout(Math.random() > 0.5 ? resolve : reject, 1000) |
| | | }).catch(() => console.log('Oops errors!')) |
| | | }, |
| | | onCancel() { |
| | | console.log('Cancel') |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | |
| | | // } |
| | | |
| | | render() { |
| | | if (this.props.fixed) { // 按钮是否固定在头部 |
| | | return ( |
| | | <Affix offsetTop={48}> |
| | | <div className="button-list"> |
| | |
| | | </Affix> |
| | | ) |
| | | } |
| | | return ( |
| | | <div className="button-list"> |
| | | {this.props.actions.map((item, index) => { |
| | | return ( |
| | | <Button |
| | | className={'mk-btn ' + item.CssClass} |
| | | icon={item.Icon} |
| | | key={'action' + index} |
| | | onClick={() => {this.actionTrigger(item)}} |
| | | >{item.MenuName}</Button> |
| | | ) |
| | | })} |
| | | </div> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default MainAction |
| | |
| | | changeTable = (pagination, filters, sorter) => { |
| | | this.setState({ |
| | | pageIndex: pagination.current, |
| | | pageSize: pagination.pageSize |
| | | pageSize: pagination.pageSize, |
| | | selectedRowKeys: [] |
| | | }) |
| | | this.props.refreshdata(pagination, filters, sorter) |
| | | } |
| | |
| | | } |
| | | .ant-table-body { |
| | | overflow-x: auto!important; |
| | | min-height: 90px; |
| | | border: 1px solid #e8e8e8; |
| | | border-radius: 4px; |
| | | border-top: none; |
| | | border-bottom: none; |
| | | table { |
| | | border-left: 0; |
| | | .ant-table-thead > tr > th:last-child { |
| | | border-right: 0; |
| | | } |
| | | .ant-table-tbody > tr > td:last-child { |
| | | border-right: 0; |
| | | } |
| | | } |
| | | } |
| | | .ant-table-body::-webkit-scrollbar { |
| | | width: 8px; |
| | |
| | | } |
| | | } |
| | | .side-menu.iframe { |
| | | height: 100%; |
| | | // height: 100%; |
| | | max-height: 100vh; |
| | | overflow-y: scroll; |
| | | &::-webkit-scrollbar { |
| | |
| | | 'main.reset': 'Reset', |
| | | 'main.copy.success': 'Copy success', |
| | | 'main.pagination.of': 'of', |
| | | 'main.pagination.items': 'items' |
| | | 'main.pagination.items': 'items', |
| | | 'main.action.confirm.tip': 'Do you want to execute?' |
| | | } |
| | |
| | | 'main.reset': '重置', |
| | | 'main.copy.success': '复制成功', |
| | | 'main.pagination.of': '共', |
| | | 'main.pagination.items': '条' |
| | | 'main.pagination.items': '条', |
| | | 'main.action.confirm.tip': '确定要执行吗?' |
| | | } |
| | |
| | | newconfig.columns = result.columns.map(column => { |
| | | return column |
| | | }) |
| | | // newconfig.columns.length = 4 |
| | | newconfig.columns.length = 4 |
| | | } |
| | | newconfig.select = result.select |
| | | this.setState(newconfig) |
| | |
| | | } |
| | | |
| | | refreshbysearch = (searches) => { |
| | | console.log(searches) |
| | | this.loadmaindata(this.state.param.pageIndex, this.state.param.pageSize, this.state.param.orderColumn, this.state.param.orderType, searches) |
| | | let param = Object.assign({}, this.state.param, { |
| | | search: searches |
| | |
| | | loading: true, |
| | | param: param |
| | | }) |
| | | // window.print() |
| | | } |
| | | |
| | | refreshbytable = (pagination, filters, sorter) => { |
| | |
| | | return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | // console.log(this.props.MenuNo) |
| | | } |
| | | |
| | | render() { |
| | | return ( |
| | | <div className="commontable"> |
| | | {!this.state.searchlist && <Loading />} |
| | | {this.state.searchlist && <MainSearch refreshdata={this.refreshbysearch} searchlist={this.state.searchlist} dict={this.state.dict} />} |
| | | {this.state.actions && <MainAction actions={this.state.actions} dict={this.state.dict} />} |
| | | {this.state.actions && <MainAction fixed={true} actions={this.state.actions} dict={this.state.dict} />} |
| | | {this.state.columns && <MainTable refreshdata={this.refreshbytable} columns={this.state.columns} data={this.state.data} select={this.state.select} total={this.state.total} loading={this.state.loading} dict={this.state.dict} />} |
| | | <Button className="main-copy" icon="copy" onClick={this.copyMenuNo} shape="circle" /> |
| | | <BackTop> |
| | |
| | | min-height: calc(100vh - 110px); |
| | | .main-copy { |
| | | position: fixed; |
| | | z-index: 2; |
| | | bottom: 75px; |
| | | right: 30px; |
| | | width: 40px; |