123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165 |
- import React, { Component } from 'react';
- import moment from 'moment';
- import { connect } from 'dva';
- import { routerRedux } from 'dva/router';
- import { Card, Modal, Button, message } from 'antd';
- import { StandardTableList } from '../../../components/AXList';
- import { renderStatus, addRowKey } from '../../../utils/utils';
- const Message = message;
- @connect(({ loading, product }) => ({
- product,
- loading: loading.models.product,
- }))
- export default class TrainingListPage extends Component {
- constructor(props) {
- super(props);
- const { state } = props.location;
- this.state = {
- UIParams: (state || {}).UIParams, // 组件的状态参数
- Queryers: (state || {}).Queryers, // 查询的条件参数
- };
- }
- componentDidMount() {
- this.props.dispatch({
- type: 'product/fetchTrainingList',
- payload: { ...this.state.Queryers },
- });
- }
- handleCreateOperation = () => {
- this.props.dispatch(routerRedux.push({
- pathname: '/product/training/create',
- state: this.state,
- }));
- };
- handleDeleteOperation = (item) => {
- Modal.confirm({
- okText: '确定',
- cancelText: '取消',
- title: '你确定要删除该师训吗?',
- onOk: () => {
- this.props.dispatch({
- type: 'product/deleteTrainingItem',
- payload: { id: item.id },
- states: this.state,
- });
- },
- });
- };
- handleEditOperation = (item) => {
- this.props.dispatch(routerRedux.push({
- pathname: `/product/training/edit/${item.pid}`,
- state: this.state,
- }));
- };
- handleFilterOperation = (params, states) => {
- this.props.dispatch({
- type: 'product/fetchTrainingList',
- payload: params,
- });
- this.setState({
- UIParams: states,
- Queryers: params,
- });
- };
- handleBatchOperation = () => {
- Message.info('暂不支持批量操作!');
- };
- render() {
- const { loading, product } = this.props;
- const { list, totalSize, pageSize, pageNo } = product;
- const renderOperation = (item) => {
- return (
- <div>
- <Button
- size="small"
- className="editBtn"
- onClick={() => this.handleEditOperation(item)}
- >编辑
- </Button>
- <Button
- size="small"
- className="delBtn"
- onClick={() => this.handleDeleteOperation(item)}
- >删除
- </Button>
- </div>
- );
- };
- const batchActions = [{
- key: 'delete',
- name: '批量删除',
- }, {
- key: 'recovery',
- name: '批量恢复',
- }];
- const basicSearch = {
- keys: [{
- name: '师训编号',
- field: 'code',
- }, {
- name: '师训名称',
- field: 'name',
- }],
- };
- const pagination = {
- pageNo,
- pageSize,
- totalSize,
- };
- const columns = [{
- title: '师训编号',
- key: 1,
- dataIndex: 'code',
- width: '20%',
- }, {
- title: '师训主题',
- key: 2,
- dataIndex: 'name',
- width: '35%',
- }, {
- title: '状态',
- key: 3,
- dataIndex: 'status',
- render: text => renderStatus(text),
- width: '12%',
- }, {
- title: '更新时间',
- key: 4,
- dataIndex: 'gmtModified',
- render: text => moment(text).format('YYYY-MM-DD HH:mm:ss'),
- width: '20%',
- }, {
- title: '操作',
- key: 5,
- dataIndex: 'operation',
- render: (_, record) => renderOperation(record),
- width: '13%',
- align: 'right',
- }];
- return (
- <Card>
- <StandardTableList
- columns={columns}
- loading={loading}
- dataSource={addRowKey(list)}
- header={{
- basicSearch,
- onFilterClick: this.handleFilterOperation,
- onCreateClick: this.handleCreateOperation,
- }}
- footer={{
- pagination,
- batchActions,
- onBatchClick: this.handleBatchOperation,
- }}
- keepUIState={{ ...this.state.UIParams }}
- />
- </Card>
- );
- }
- }
|