
import ProTable from '@ant-design/pro-table';

// import useRequest from '@ahooksjs/use-request';
import { Descriptions, Table, Typography } from 'antd';
import { useRef, useState } from 'react';

import type { ConnectState } from '@/models/connect';
import type { ProFormInstance } from '@ant-design/pro-form';
import type { ActionType, ProColumns } from '@ant-design/pro-table';
import type { YSSELLDETAILSModel } from '../data';
import type { CurrentUser } from '@/models/user';

import { getYSSellDetailsList } from '../service';
import numeral from 'numeral';

import { connect } from 'umi';

const { Text } = Typography;

// import '../style.less';

/**
 * @description: 销售流水明细
 * @param {CurrentUser} currentUser 当前登录用户的信息，
 * @param {string} id 订单唯一编码
 * @return {} 
 */
const CommoditysaleTable: React.FC<{ currentUser: CurrentUser | undefined, id: string }> = (props) => {
    const { currentUser, id } = props
    const actionRef = useRef<ActionType>();
    const formRef = useRef<ProFormInstance>();
    const columns: ProColumns<YSSELLDETAILSModel>[] = [

        {
            dataIndex: 'index',
            title: '序号',
            hideInSearch: true,
            valueType: 'index',
            fixed: true,
            align: 'center',
            width: 48,
        },

        {
            dataIndex: 'COMMODITY_BARCODE',
            title: '商品条码',
            hideInSearch: true,

        },
        {
            dataIndex: 'COMMODITY_NAME',
            title: '商品名称',
            hideInSearch: true,

        },
        {
            dataIndex: 'SELLDETAILS_COUNT',
            title: '销售数量',
            hideInSearch: true,
            align: 'right',
            sorter: (a, b) => a.SELLDETAILS_COUNT - b.SELLDETAILS_COUNT
        },

        {
            dataIndex: 'SELLDETAILS_PRICE',
            title: '销售单价',
            valueType: "money",
            hideInSearch: true,

            align: 'right',
            sorter: (a, b) => a.SELLDETAILS_PRICE - b.SELLDETAILS_PRICE
        },
        {
            dataIndex: 'SELLDETAILS_AMOUNT',
            title: '实收金额',
            valueType: "money",
            hideInSearch: true,

            align: 'right',
            sorter: (a, b) => a.SELLDETAILS_AMOUNT - b.SELLDETAILS_AMOUNT
        },
        {
            dataIndex: 'SELLDETAILS_OFFPRICE',
            title: '优惠金额',
            valueType: "money",
            hideInSearch: true,

            align: 'right',
            sorter: (a, b) => a.SELLDETAILS_OFFPRICE - b.SELLDETAILS_OFFPRICE
        }

    ];

    return (


        <ProTable<YSSELLDETAILSModel>
            size="small"
            style={{ minHeight: 610 }}
            rowKey="COMMODITY_BARCODE"
            formRef={formRef}
            actionRef={actionRef}
            search={false}
            params={{ SELLMASTER_CODE: id }}
            request={async (params) => {
                const data = await getYSSellDetailsList({
                    ...params,
                });
                console.log('data', data);

                return data;
            }}
            headerTitle={<Text type="success" style={{ color: "#1890ff", fontSize: 14 }} strong>销售明细</Text>}
            bordered
            columns={columns}
            tableExtraRender={
                (_, data) => {

                    if (data) {

                        const reduceData = data.reduce((
                            previousValue: { SELLDETAILS_OFFPRICE: number, SELLDETAILS_COUNT: number, SELLDETAILS_AMOUNT: number },
                            currentValue: YSSELLDETAILSModel) => {

                            previousValue.SELLDETAILS_COUNT += currentValue.SELLDETAILS_COUNT || 0; // 销售数量
                            previousValue.SELLDETAILS_OFFPRICE += currentValue.SELLDETAILS_OFFPRICE || 0; // 优惠金额
                            previousValue.SELLDETAILS_AMOUNT += currentValue.SELLDETAILS_AMOUNT || 0; // 实收金额
                            return previousValue
                        }, { SELLDETAILS_OFFPRICE: 0, SELLDETAILS_COUNT: 0, SELLDETAILS_AMOUNT: 0 });

                        return <div style={{ paddingLeft: 24, paddingTop: 24 }}>

                            <Descriptions
                                title={<Text type="success" style={{ color: "#1890ff", fontSize: 14 }}>销售汇总</Text>}
                                size="small" column={5}
                                className="commity-sale-description"
                                contentStyle={{ fontWeight: "bolder" }} labelStyle={{ color: "#00000073" }}
                            >

                                <Descriptions.Item label="实收金额">¥{numeral(reduceData.SELLDETAILS_AMOUNT).format('0,0.00')}</Descriptions.Item>
                                <Descriptions.Item label="销售数量">{numeral(reduceData.SELLDETAILS_COUNT).format('0,0')}</Descriptions.Item>
                                <Descriptions.Item label="优惠金额">¥{numeral(reduceData.SELLDETAILS_OFFPRICE).format('0,0.00')}</Descriptions.Item>
                            </Descriptions>


                        </div>

                    }
                    return <></>
                }
            }

            // summary={(pageData) => {
            //     let [SELLDETAILS_COUNT, SELLDETAILS_OFFPRICE, SELLDETAILS_AMOUNT] = [0, 0, 0];
            //     const index = pageData.length;
            //     pageData.forEach((n: YSSELLDETAILSModel) => {
            //         SELLDETAILS_COUNT += n.SELLDETAILS_COUNT || 0;
            //         SELLDETAILS_OFFPRICE += n.SELLDETAILS_OFFPRICE || 0;
            //         SELLDETAILS_AMOUNT += n.SELLDETAILS_AMOUNT || 0;
            //     });
            //     return pageData.length > 0 ? (
            //         <Table.Summary fixed>
            //             <Table.Summary.Row>
            //                 <Table.Summary.Cell colSpan={3} index={index} align="center">
            //                     {' '}
            //                     <Text strong>合计</Text>{' '}
            //                 </Table.Summary.Cell>
            //                 <Table.Summary.Cell index={index} align="right">
            //                     <Text type="danger">{SELLDETAILS_COUNT}</Text>
            //                 </Table.Summary.Cell>
            //                 <Table.Summary.Cell index={index} align="right"></Table.Summary.Cell>
            //                 <Table.Summary.Cell index={index} align="right">
            //                     <Text type="danger">¥{numeral(SELLDETAILS_AMOUNT).format('0,0.00')}</Text>
            //                 </Table.Summary.Cell>
            //                 <Table.Summary.Cell index={index} align="right">
            //                     <Text type="danger">¥{numeral(SELLDETAILS_OFFPRICE).format('0,0.00')}</Text>
            //                 </Table.Summary.Cell>



            //             </Table.Summary.Row>
            //         </Table.Summary>
            //     ) : (
            //         <></>
            //     );
            // }}
            // options={false}
            // manualRequest={true}
            pagination={{ defaultPageSize: 10, size: "small" }}
        />

    );
};

export default connect(({ user }: ConnectState) => ({
    currentUser: user.currentUser
}))(CommoditysaleTable);
