import LeftSelectTree from "@/components/leftSelectTree/leftSelectTree";
import { ActionType, FormInstance, ProTable } from "@ant-design/pro-components";
import { useRef, useState } from "react";
import { getFieldEnumTreeNoSession, handleGetSUGGESTIONReport } from "../serverpartAssets/service";
import { Drawer, Modal } from "antd";
import ComplaintForwardingProcessList from "./ComplaintForwardingProcessList";
import moment from "moment";

const ComplaintForwardingProcessReport = () => {
    const actionRef = useRef<ActionType>();
    const formRef = useRef<FormInstance>();
    // 树相关的属性和方法
    const [selectedId, setSelectedId] = useState<string>()
    const [collapsible, setCollapsible] = useState<boolean>(false)
    // 显示详情抽屉
    const [showDetailModal, setShowDetailModal] = useState<boolean>(false)
    // 当前行数据
    const [currentRow, setCurrentRow] = useState<any>()
    // 要查看的类型 
    const [isComponentsParams, setIsComponentsParams] = useState<any>()
    // 搜索入参
    const [searchParams, setSearchParams] = useState<any>()

    // 表格列内容
    const columns: any = [
        {
            title: "统计时间",
            dataIndex: 'search_date',
            valueType: 'dateRange',
            hideInTable: true,
            hideInDescriptions: true,
            search: {
                transform: (value) => {
                    return {
                        SUGGESTION_CREATEDATE_Start: value[0],
                        SUGGESTION_CREATEDATE_End: value[1],
                    };
                },
            },
            initialValue: [moment().subtract(1, 'M'), moment()],
        },
        {
            title: "建议类型",
            dataIndex: "SUGGESTION_TYPES",
            valueType: 'select',
            valueEnum: {
                "1000": "投诉",
                "1050": "表扬",
                "4000": "咨询/建议"
            },
            hideInTable: true
        },
        {
            title: "投诉渠道",
            width: 120,
            dataIndex: "SUGGESTION_CHANNELS",
            valueType: "select",
            align: 'center',
            request: async () => {
                const taxRateLabel: any = await getFieldEnumTreeNoSession({ FieldExplainField: 'SUGGESTION_CHANNEL', notformate: true })
                console.log('taxRateLabeltaxRateLabel', taxRateLabel);

                return taxRateLabel
            },
            hideInTable: true
        },
        {
            title: "服务区",
            width: 200,
            align: 'center',
            dataIndex: "ServerPart_Name",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.SpregionType_Name || record?.ServerPart_Name
            }
        },
        {
            title: "总计",
            width: 120,
            align: 'center',
            dataIndex: "TotalCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.TotalCount ? <a onClick={() => {
                    handleGetComponentsParams(1, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.TotalCount}</a > : "0"
            }
        },
        {
            title: "投诉数量",
            width: 120,
            align: 'center',
            dataIndex: "ComplaintCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.ComplaintCount ? <a onClick={() => {
                    handleGetComponentsParams(2, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.ComplaintCount}</a > : "0"
            }
        },
        {
            title: "表扬数量",
            width: 120,
            align: 'center',
            dataIndex: "PraiseCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.PraiseCount ? <a onClick={() => {
                    handleGetComponentsParams(3, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.PraiseCount}</a> : "0"
            }
        },
        {
            title: "咨询建议数量",
            width: 120,
            align: 'center',
            dataIndex: "ConsultationSuggestionCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.ConsultationSuggestionCount ? <a onClick={() => {
                    handleGetComponentsParams(4, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.ConsultationSuggestionCount}</a> : "0"
            }
        },
        {
            title: "小程序数量",
            width: 120,
            align: 'center',
            dataIndex: "MiniProgramCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.MiniProgramCount ? <a onClick={() => {
                    handleGetComponentsParams(5, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.MiniProgramCount}</a> : "0"
            }
        },
        {
            title: "12328交通运输数量",
            width: 120,
            align: 'center',
            dataIndex: "Transport12328Count",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.Transport12328Count ? <a onClick={() => {
                    handleGetComponentsParams(6, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.Transport12328Count}</a> : "0"
            }
        },
        {
            title: "网络舆情数量",
            width: 120,
            align: 'center',
            dataIndex: "OnlineOpinionCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.OnlineOpinionCount ? <a onClick={() => {
                    handleGetComponentsParams(7, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.OnlineOpinionCount}</a> : "0"
            }
        },
        {
            title: "监控中心值班电话数量",
            width: 120,
            align: 'center',
            dataIndex: "MonitoringCenterCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.MonitoringCenterCount ? <a onClick={() => {
                    handleGetComponentsParams(8, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.MonitoringCenterCount}</a> : "0"
            }
        },
        {
            title: "话务转办数量",
            width: 120,
            align: 'center',
            dataIndex: "TransferCount",
            hideInSearch: true,
            ellipsis: true,
            render: (_, record) => {
                return record?.TransferCount ? <a onClick={() => {
                    handleGetComponentsParams(9, record)
                    setCurrentRow(record)
                    setShowDetailModal(true)
                }}> {record?.TransferCount}</a> : "0"
            }
        }
    ]

    // 处理入参的办法
    const handleGetComponentsParams = (type: number, obj: any) => {
        // type  1 总计 2 投诉数量 3 表扬数量 4 咨询建议数量 5 小程序数量 6 12328交通运输数量 7 网络舆情数量 8 监控中心值班电话数量 9 话务转办数量
        console.log('dasda', obj);

        let req: any = {}
        let SERVERPART_IDS: string = ""
        if (obj.Type === 0) {
            if (obj.children && obj.children.length > 0) {
                obj.children.forEach((item: any) => {
                    if (SERVERPART_IDS) {
                        SERVERPART_IDS += `,${item.ServerPart_Id}`
                    } else {
                        SERVERPART_IDS = item.ServerPart_Id
                    }
                })
            }
        } else if (obj.Type === 1) {
            SERVERPART_IDS = obj.ServerPart_Id
        }
        console.log('SERVERPART_IDSSERVERPART_IDS', SERVERPART_IDS);
        console.log('type123123', type);

        if (type === 1) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 2) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_TYPES: "1000,2000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 3) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_TYPES: "1050",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 4) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_TYPES: "4000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 5) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CHANNELS: "1000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 6) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CHANNELS: "2000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 7) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CHANNELS: "3000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 8) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CHANNELS: "4000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        } else if (type === 9) {
            req = {
                SearchParameter: {
                    SERVERPART_IDS: SERVERPART_IDS,
                    SUGGESTION_CHANNELS: "5000",
                    SUGGESTION_CREATEDATE_Start: searchParams?.SUGGESTION_CREATEDATE_Start || "",
                    SUGGESTION_CREATEDATE_End: searchParams?.SUGGESTION_CREATEDATE_End || ""
                },
                SortStr: "SUGGESTION_CREATEDATE desc",
                PageIndex: 1,
                PageSize: "999999"
            }
        }
        console.log('reqreq', req);

        setIsComponentsParams(req)
    }

    return (
        <div style={{ height: 'calc(100vh - 100px)', background: "#fff", display: 'flex' }}>
            <LeftSelectTree setSelectedId={setSelectedId} setCollapsible={setCollapsible} collapsible={collapsible} serverPartType={'1000'} ServerpartSiteType={'1000,1010,3000'} />
            <div style={{
                width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
                paddingTop: 0,
                paddingBottom: 0,
                paddingRight: 0
            }}>
                <ProTable
                    actionRef={actionRef}
                    formRef={formRef}
                    columns={columns}
                    bordered
                    rowKey={(record: any) => {
                        return `${record?.SpregionType_Id}-${record?.ServerPart_Id}-${record?.Type}`
                    }}
                    scroll={{ x: '100%', y: 'calc(100vh - 450px)' }}
                    headerTitle={'流程报表'}
                    search={{ span: 6 }}
                    request={async (params) => {
                        if (!selectedId) {
                            return []
                        }
                        console.log('paramsparams', params);

                        const req: any = {
                            SearchParameter: {
                                SERVERPART_IDS: selectedId,
                                SUGGESTION_TYPES: params?.SUGGESTION_TYPES || "",
                                SUGGESTION_CHANNELS: params?.SUGGESTION_CHANNELS || "",
                                SUGGESTION_CREATEDATE_Start: params?.SUGGESTION_CREATEDATE_Start || "",
                                SUGGESTION_CREATEDATE_End: params?.SUGGESTION_CREATEDATE_End || ""
                            },
                            PageIndex: 1,
                            PageSize: 999999
                        }
                        setSearchParams(params)
                        const data = await handleGetSUGGESTIONReport(req)
                        console.log('datadata', data);

                        if (data && data.length > 0) {
                            return { data, success: true }
                        }
                        return { data: [], success: true }
                    }}
                    toolbar={{
                        actions: [

                        ]
                    }}
                />


            </div>

            <Drawer
                width={"80%"}
                open={showDetailModal}
                onClose={() => {
                    setShowDetailModal(false)
                    setCurrentRow(undefined)
                    setIsComponentsParams(undefined)
                }}
                destroyOnClose
                footer={false}
            >
                <ComplaintForwardingProcessList isComponents={true} isComponentsParams={isComponentsParams} />
            </Drawer>
        </div>
    )

}
export default ComplaintForwardingProcessReport;