Highways4Good/web/client/src/sections/fillion/components/promotionalTable.js

import React, { useEffect, useState } from 'react';
import { connect } from 'react-redux';
import { Spin, Button, Popconfirm, Badge } from 'antd';
import ProTable from '@ant-design/pro-table';
import './protable.less'
import moment from 'moment';
import { getReportStatistic } from "../actions/infor"
const promotionalTable = (props) => {
    const { dispatch, user, depData, depMessage, depLoading } = props
    const [rowSelected, setRowSelected] = useState([])
    const [regionId, setRegionId] = useState()//区域id
    const [placeType, setPlaceType] = useState()//场所
    const [day, setDay] = useState([moment('2022-03-01').format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')])//日期
    const [sitename, setSitename] = useState()//场所名称
    const [counts, setCounts] = useState()//shuju


    const columns =
        [{
            title: '序号',
            search: false,
            dataIndex: 'containers',

            fixed: 'left',
            width: 120,
            render: (dom, record) => {
                return record.address
            },
            fieldProps: {
                getPopupContainer: (triggerNode) => triggerNode.parentNode,
            }
        },
            {
                title: '视频名称',
                dataIndex: 'placeName',
                fixed: 'left',
                width: 120,
                options: 1,
                backgroundColor: "#ffffff",
                fieldProps: {
                    onChange: (value, cs) => {
                        setSitename(value.currentTarget.value)
                    },
                    placeholder: '请输入视频名称进行搜索',
                    getPopupContainer: (triggerNode) => triggerNode.parentNode,
                },
            },
            
            {
                title: '修改时间',
                search: false,
                dataIndex: 'time2',
                valueType: 'dateRange',
                // align: 'right',
                width: 120,
                render: (dom, record) => {
                    return record.address
                },
                fieldProps: {
                    getPopupContainer: (triggerNode) => triggerNode.parentNode,
                }
            },
            {
                key: "direction",
                hideInTable: true,
                dataIndex: "direction",
                order: 6,
                renderFormItem: (item, { type, defaultRender, ...rest }, form) => {
                    return (
                        <div> <Button
                            type="primary"
                            style={{ width: "100px" }}
                            onClick={() => {
                                dispatch(push(`article/update/post`));
                            }}
                        >
                            新增
                        </Button>
                        </div>


                    );
                },
            },
        ]
    return (
        <Spin spinning={false}>
            <div className='protable-transpor'>
                <ProTable
                    scroll={{ x: 800 }}
                    options={false}
                    ref={c => { finishedProductTable = c; }}
                    style={{ width: "100% ", overflow: "auto", height: '760px' }}
                    rowKey='id'
                    onReset={(v) => {
                        const { id } = depMessage[0]
                        console.log(id)
                        setRegionId(id)
                        setPlaceType(-1)
                        setDay([moment('2022-03-01').format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')])
                        setSitename('')
                    }}
                    rowSelection={{
                        selectedRowKeys: rowSelected,
                        onChange: (selectedRowKeys) => {
                            setRowSelected(selectedRowKeys);
                        },
                    }}
                    columns={columns}

                    dataSource={(counts || {}).rows || []}
                    request={async (params) => {
                        const query = {
                            // startDate: day[0],
                            // endDate: day[1],
                            // placeType: placeType,
                            // regionId: regionId,
                            // placeName: sitename,
                            // limit: params.pageSize,
                            // offset: ((params.current ? params.current : 1) - 1) * params.pageSize
                        }
                        setRowSelected([]);
                        const res = await dispatch(getReportStatistic(query));
                        setCounts(res.payload.data)
                        return {
                            ...res,
                            total: res.payload.data ? res.payload.data.count : 0
                        }
                    }}
                    // search={{
                    //     defaultCollapsed: false,
                    //     optionRender: (searchConfig, formProps, dom) => [
                    //         ...dom.reverse(),
                    //         <Popconfirm title="确认导出?" onConfirm={() => { props.exports(rowSelected, counts) }}>
                    //             <Button
                    //             >
                    //                 导出
                    //             </Button>
                    //         </Popconfirm>
                    //     ],
                    // }}

                >
                </ProTable></div>

        </Spin >
    )
}
function mapStateToProps(state) {
    const { auth, depMessage } = state;
    const pakData = (dep) => {
        return dep.map((d) => {
            return {
                title: d.name,
                value: d.id,
                // children: d.type >= 2 ? [] : pakData(d.subordinate)
                children: pakData(d.subordinate)
            }
        })
    }
    let depData = pakData(depMessage.data || [])
    return {
        user: auth.user,
        depMessage: depMessage.data || [],
        depLoading: depMessage.isRequesting,
        depData,
    };
}
export default connect(mapStateToProps)(promotionalTable);