import numeral from "numeral";
import useRequest from "@ahooksjs/use-request";
import ProTable from "@ant-design/pro-table";
import ProDescriptions from "@ant-design/pro-descriptions";
import { useRef, useState } from "react";
import { PageContainer } from "@ant-design/pro-layout";
import { Descriptions, Drawer, Space, Tooltip, Typography, Upload } from "antd";

import type { ActionType, ProColumns } from "@ant-design/pro-table";
import type { ProDescriptionsItemProps } from "@ant-design/pro-descriptions";
import type { paramsModel, CommdityModel } from "../data";
import { getCommodityList } from "../service";
import { getFieldEnum, getFieldEnumTree } from "@/services/options";


const OnSale = ({ projectDetail }: { projectDetail: any }) => {
    const actionRef = useRef<ActionType>();
    const [currentRow, setCurrentRow] = useState<CommdityModel | any>();
    const [showDetail, setShowDetail] = useState<boolean>();
    // const [qualification, setQualification] = useState<QualificationModel>() // 选中的资质
    // const { run: getDetail } = useRequest(async (QualificationId) => { // 查询商品资质
    //     setQualification(data)
    // }, { manual: true })

    // 表格列数据配置
    const columns: ProColumns<CommdityModel>[] = [
        {
            dataIndex: 'keyword',
            title: '名称/条码',
            hideInDescriptions: true,
            hideInTable: true,
        },
        {
            dataIndex: 'index',
            title: '序号',
            hideInSearch: true,
            valueType: 'index',
            fixed: true,
            align: 'center',
            width: 68,
            render: (text, record, index) => {
                if (record?.COMMODITY_ID || record?.COMMODITY_ID === 0) {
                    const page = actionRef.current?.pageInfo;
                    return index + (page.current - 1) * page.pageSize + 1;
                }
                return ''
            },
        },
        {
            dataIndex: 'COMMODITY_NAME',
            title: '名称',
            hideInSearch: true,
            hideInDescriptions: true,
            // width: '20%',
            render: (_, record) => {
                return <Space size={8}>
                    {/* {record?.QUALIFICATION_ID ? <Tooltip title="已绑定食品资质"><SafetyCertificateTwoTone /></Tooltip> : ''} */}
                    <a
                        onClick={() => {
                            setCurrentRow(record);
                            setShowDetail(true);
                            // getDetail(record?.QUALIFICATION_ID ? record?.QUALIFICATION_ID : 0);
                            // setQualification(undefined)
                        }}
                    >
                        {_}
                    </a>
                </Space>
            }
        },
        {
            dataIndex: 'COMMODITY_BARCODE',
            title: '条码',
            align: 'center',
            hideInSearch: true,
            fixed: true
        },
        {
            dataIndex: 'COMMODITY_RETAILPRICE',
            title: '零售价',
            align: 'right',
            width: 120,
            hideInSearch: true,
            render: (_) => {
                return numeral(_).format('0,0.00');
            },
        },
        {
            dataIndex: 'COMMODITY_RULE',
            title: '规格',
            align: 'center',
            width: 120,
            hideInSearch: true,
        },
        {
            dataIndex: 'COMMODITY_UNIT',
            title: '单位',
            align: 'center',
            width: 120,
            hideInSearch: true,
        },
        {
            dataIndex: 'COMMODITY_ORI',
            title: '产地',
            align: 'center',
            hideInSearch: true,
            hideInTable: true,
        },
        {
            dataIndex: 'COMMODITY_GRADE',
            title: '质量等级',
            align: 'center',
            valueType: 'select',
            request: async () => {
                return await getFieldEnum({ FieldExplainField: 'COMMODITYGRADE' });
            },
            hideInSearch: true,
            hideInTable: true,
        },
        // {
        //     dataIndex: 'COMMODITY_HOTKEY',
        //     title: '快捷键',
        //     hideInSearch: true,
        //     // hideInTable: true,
        // },
        {
            dataIndex: 'SERVERPART_ID',
            title: '所属服务区',
            width: 130,
            align: 'center',
            valueType: 'select',
            hideInSearch: true,
            request: async () => {
                return await getFieldEnumTree({ FieldExplainField: 'ServerpartIds', sessionName: 'ServerpartIds' });
            },
        },
        {
            dataIndex: 'BUSINESSTYPE',
            title: '商品业态',
            align: 'center',
            width: 120,
            valueType: 'select',
            hideInSearch: true,
            request: async () => {
                return await getFieldEnum({ FieldExplainField: 'BUSINESSTYPE', sessionName: 'BUSINESSTYPE', notformate: true });
            },
        },
        {
            dataIndex: 'COMMODITY_STATE',
            title: '状态',
            align: 'center',
            initialValue: '1',
            valueType: 'select',
            width: 80,
            valueEnum: { 0: { text: '下架', status: 'error' }, 1: { text: '在售', status: 'processing' } },
        },
        // {
        //     dataIndex: 'QUALIFICATION_ID',
        //     title: '关联资质',
        //     hideInTable: true,
        //     hideInDescriptions: true,
        //     valueType: 'select',
        //     valueEnum: { '0': '已关联', '-1': '未关联' }
        // },
        {
            dataIndex: 'STAFF_NAME',
            title: '操作员',
            hideInTable: true,
            hideInSearch: true,
        },
        {
            dataIndex: 'OPERATE_DATE',
            title: '更新时间',
            valueType: 'fromNow',
            hideInTable: true,
            hideInSearch: true,
        },

    ];

    return (
        <PageContainer header={{
            title: '',
            breadcrumb: {},
        }}>
            <ProTable<CommdityModel>
                rowKey="COMMODITY_ID"
                headerTitle="在售商品"
                actionRef={actionRef}
                search={{ span: 6 }}
                request={async (params) => {
                    if (projectDetail) {
                        const data = await getCommodityList({
                            SearchType: -1,
                            SearchKey: params.keyword ? 'COMMODITY_NAME,COMMODITY_BARCODE' : null,
                            SearchValue: params.keyword ? params.keyword : null, // 关键词查询
                            ServerpartShopID: projectDetail, CommodityState: params.COMMODITY_STATE,
                            PageSize: 999999, SortStr: 'COMMODITY_STATE desc,OPERATE_DATE desc'
                        } as paramsModel);
                        return data;
                    }
                    return { data: [], success: true }
                }}
                columns={columns}
                pagination={false}
            />
            <Drawer
                width={800}
                visible={showDetail}
                onClose={() => {
                    setCurrentRow(undefined);
                    setShowDetail(false);
                }}
                closable={false}
            >
                {currentRow?.COMMODITY_NAME && (
                    <>
                        <ProDescriptions<CommdityModel>
                            column={2}
                            title={currentRow?.COMMODITY_NAME}
                            request={async () => ({
                                data: currentRow || {},
                            })}
                            params={{
                                id: projectDetail.id,
                            }}
                            columns={columns as ProDescriptionsItemProps<CommdityModel>[]}
                        />
                        {/* {qualification && qualification?.QUALIFICATION_NAME && (<div >
                            <Typography.Text strong>食品资质</Typography.Text>
                            <Descriptions column={2} style={{ marginTop: 16 }} >
                                <Descriptions.Item label="名称">{qualification?.QUALIFICATION_NAME}</Descriptions.Item>
                                <Descriptions.Item label="供应商名称">{qualification?.SUPPLIER_NAME}</Descriptions.Item>
                                <Descriptions.Item label="类型" >{{ 1000: '普通资质', 2000: '零星资质' }[qualification?.QUALIFICATION_TYPE]}</Descriptions.Item>
                                <Descriptions.Item label="有效期至" >{qualification?.QUALIFICATION_ENDDATE &&
                                    moment().add(1, 'month').diff(moment(qualification?.QUALIFICATION_ENDDATE)) > 0 &&
                                    moment(qualification?.QUALIFICATION_ENDDATE).diff(moment().format('YYYY/MM/DD')) >= 0 ?
                                    <Space style={{ color: '#FD4B54' }}>{qualification?.QUALIFICATION_ENDDATE}</Space> :
                                    qualification?.QUALIFICATION_ENDDATE}</Descriptions.Item>
                                {qualification?.QUALIFICATION_TYPE === 2000 && <Descriptions.Item label="说明" >{qualification?.QUALIFICATION_DESC}</Descriptions.Item>}
                            </Descriptions>
                            <Upload
                                defaultFileList={transferImg(qualification?.ImgList) as unknown as UploadFile[] || []}
                                showUploadList={{
                                    showDownloadIcon: false,
                                    showRemoveIcon: false,
                                }}
                            />
                        </div>)} */}
                    </>
                )}
            </Drawer>
        </PageContainer>
    );
}
export default OnSale
