import { connect } from "umi";
import type { CurrentUser } from "umi";
import type { ConnectState } from "@/models/connect";
import React, { useRef, useState } from "react";
import ProCard from "@ant-design/pro-card";
import { MenuFoldOutlined } from "@ant-design/icons";
import type { FormInstance } from "antd";
import { Drawer } from "antd";
import { Button, Spin } from "antd";
import { message, Space, Tree } from "antd";
import useRequest from "@ahooksjs/use-request";
import { getFieldEnum, getServerpartTree, handleCallLogs } from "@/services/options";
import type { ActionType } from "@ant-design/pro-table";
import ProTable from "@ant-design/pro-table";
import { handleGetExamineList } from "@/pages/examine/examineList/service";
import moment from "moment";
import {
  handleGetGetRevenueYOYQOQ,
  handleGetGetRevenueYOYQOQByDate,
  handleGetMOM
} from "@/pages/reports/BusinessAnalysis/revenueYOYQOQReport/service";
import ReactHTMLTableToExcel from "react-html-table-to-excel";
import search from "@/pages/BussinessProject/search";
import session from "@/utils/session";
import { handleGetShopShortNames, handleGetShopShortNamesGet } from "@/pages/reports/BusinessAnalysis/transactionAnalysis/service";
import CarTrafficChart from "./components/CarTrafficChart";
import PageTitleBox from "@/components/PageTitleBox";
import { formatTreeData } from "@/utils/format";
import { exportXlsxFromProColumnsExcelJS } from "@/utils/exportExcelFun";


const revenueYOYQOQReport: React.FC<{ currentUser: CurrentUser }> = (props) => {
  const { currentUser } = props
  const downloadBtnRef = useRef<any>()

  const actionRef = useRef<ActionType>();
  const actionByDateRef = useRef<ActionType>();
  const formRef = useRef<FormInstance>();
  const formByDateRef = useRef<FormInstance>();
  const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
  const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
  const [collapsible, setCollapsible] = useState<boolean>(false)
  const [treeView, setTreeView] = useState<any>()
  // 查询的条件
  const [searchParams, setSearchParams] = useState<any>()
  // 加载服务区树
  const { loading: treeLoading, data: treeViews } = useRequest(async () => {
    const data = await getServerpartTree(currentUser?.ProvinceCode, currentUser?.CityAuthority, true, true, true)
    setTreeView(data)
    return data
  })
  // 导出的加载效果
  const [showLoading, setShowLoading] = useState<boolean>(false)
  // 是否显示打印的表格
  const [showExportTable, setShowExportTable] = useState<boolean>(false)
  // 树相关的属性和方法
  const [selectedId, setSelectedId] = useState<string>()
  // 第一次进来默认的表格方法不调用
  const [isFirst, setIsFirst] = useState<boolean>(true)
  const businessTypeObj = session.get("BUSINESSTYPEObj")
  const [columnsStateMap, setColumnsStateMap] = useState<any>({
    // Business_Type:{show:false},
    ShopTrade: { show: false }
  })
  const [columnsDailyStateMap, setColumnsDailyStateMap] = useState<any>({
    MERCHANTS_NAME: { show: false },
    ShopTrade: { show: false }
  })
  // 展示自营业态
  const [showSelfBusiness, setShowSelfBusiness] = useState<boolean>(true)
  // 自营业态的选择列表
  const [shopNamesList, setShopNamesList] = useState<any>()
  // 显示每日流水抽屉
  const [showDailyDrawer, setShowDailyDrawer] = useState<boolean>(false)
  const [currentRow, setCurrentRow] = useState<any>()
  const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
  const SHOPTRADEObj = session.get('SHOPTRADEObj')
  // 实收金额数据
  const [amountReceivedData, setAmountReceivedData] = useState<any>()
  // 销售数量数据
  const [salesQuantityData, setSalesQuantityData] = useState<any>()
  // 客单数量数据
  const [customerOrdersData, setCustomerOrdersData] = useState<any>()


  const BUSINESSTYPEObj = session.get('BUSINESSTYPEObj')
  const columns: any = [
    // {
    //   title: '序号',
    //   dataIndex: 'index',
    //   valueType: 'index',
    //   hideInSearch: true,
    //   fixed: 'left',
    //   width: 140,
    // },
    {
      title: '服务区名称',
      width: 170,
      dataIndex: 'Name',
      fixed: 'left',
      ellipsis: true,
      align: 'center',
      hideInSearch: true,
      render: (_, record) => {
        return showDailyDrawer ? record?.Name : <a onClick={() => {
          console.log('record', record)
          if (moment(searchParams?.StartDate).format('YYYY-MM-DD') !== moment(searchParams?.EndDate).format('YYYY-MM-DD')) {
            if (record?.Name === '合计') {
              let id: string = ''
              if (record?.children && record?.children.length > 0) {
                record?.children.forEach((item: any) => {
                  if (item?.children && item?.children.length > 0) {
                    item?.children.forEach((subItem: any) => {
                      if (id) {
                        id += `,${subItem.Id}`
                      } else {
                        id = subItem.Id
                      }
                    })
                  }
                })
              }
              setCurrentRow({
                ...record,
                Id: id
              })
            }
            else if (record?.Name && record?.Name.indexOf('管理中心') !== -1) {
              let id: string = ''
              if (record?.children && record?.children.length > 0) {
                record?.children.forEach((item: any) => {
                  if (id) {
                    id += `,${item.Id}`
                  } else {
                    id = item.Id
                  }
                })
              }
              setCurrentRow({
                ...record,
                Id: id
              })
            }
            else {
              setCurrentRow(record)
            }
            setShowDailyDrawer(true)
          }
        }}>{record?.Name}</a>
      }
    },
    {
      title: '经营商户',
      width: 120,
      ellipsis: true,
      align: 'center',
      dataIndex: 'MERCHANTS_NAME',
      hideInSearch: true,
    },
    {
      dataIndex: 'ShowShop',
      title: '统计类型',
      valueType: "select",
      hideInTable: true,
      valueEnum: {
        1: '门店',
        0: '服务区',
        2: '日度'
      },
      initialValue: '1',
    },
    // {
    //   dataIndex: 'ShowShop',
    //   title:'统计类型',
    //   valueType: "radioButton",
    //   fixed: true,
    //   initialValue: '1',
    //   valueEnum: {
    //     1: '门店',
    //     0: '服务区'
    //   },
    //   hideInTable: true,
    //   fieldProps: {
    //     onChange: (event: any) => {
    //       formRef.current?.submit()
    //     },
    //     labelCol: { span: 0 },
    //     wrapperCol: { span: 24 }
    //   },
    // },
    {
      title: '统计时间',
      dataIndex: 'search_date',
      valueType: 'dateRange',
      hideInTable: true,
      hideInDescriptions: true,
      initialValue: [moment().subtract(1, 'months'), moment().add(-1, 'day')],
      search: {
        transform: (value) => {
          return {
            StartDate: value[0],
            EndDate: value[1],
          };
        },
      },
      fieldProps: {
        disabledDate: (current: any) => current && current > moment().endOf('day')
      }
    },
    {
      title: '经营模式',
      dataIndex: 'businessType',
      valueType: 'select',
      hideInTable: true,
      valueEnum: BUSINESSTYPEObj,
      fieldProps: {
        mode: "multiple",
        onChange: async (e) => {
          console.log('e', e)
          const flag = e.filter(item => item === '1000')?.toString() || ''
          console.log('flag', flag)
          if (flag) {
            setShowSelfBusiness(false)
            // handleGetShopNamesList(selectedId)
          } else {
            setShowSelfBusiness(true)
            // setShopNamesList({})
          }
        }
      }
    },
    {
      title: '自营业态',
      dataIndex: 'shopNames',
      hideInTable: true,
      hideInSearch: showSelfBusiness,
      valueType: 'select',
      valueEnum: shopNamesList,
      // request: async () => {
      //   return await getFieldEnum({ FieldExplainField: 'BUSINESSTYPE' })
      // },
      fieldProps: {
        multiple: true,
        showSearch: true,
        filterOption: (input, option) => (option?.label ?? '').toLowerCase().includes(input.toLowerCase()),
      }
    },
    {
      title: '外接系统',
      dataIndex: 'targetSystem',
      valueType: 'select',
      hideInTable: true,
      valueEnum: {
        "": '全部',
        1: "是",
        0: "否"
      },
      initialValue: ""
    },
    {
      title: '',
      dataIndex: 'SearchKeyValue',
      hideInTable: true,
      fieldProps: {
        placeholder: "请输入商户/品牌/门店/服务区"
      }
    },
    {
      dataIndex: 'ShopTrade',
      title: '商品业态',
      align: 'center',
      width: 120,
      valueType: 'select',
      hideInSearch: true,
      request: async () => {
        // 这里要手动添加枚举字段（从下面这些字典中选择一个）：商品业态[BUSINESSTYPE]
        const options = await getFieldEnum({ FieldExplainField: 'BUSINESSTYPE' });
        return options;
      },
    },
    {
      title: '实收金额',
      dataIndex: '',
      hideInSearch: true,
      children: [
        {
          title: <div style={{ textAlign: 'center' }}>本期</div>,
          width: 120,
          dataIndex: 'CASHPAY_CURR',
          hideInSearch: true,
          valueType: 'digit',
          align: 'right',
          sorter: (a, b) => a.CASHPAY_CURR - b.CASHPAY_CURR,
          defaultSortOrder: 'descend',
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比</div>,
          width: 120,
          dataIndex: 'CASHPAY_MONTH',
          align: 'right',
          hideInSearch: true,
          valueType: 'digit'
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比</div>,
          width: 120,
          dataIndex: 'CASHPAY_YEAR',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比率</div>,
          width: 120,
          dataIndex: 'MOM_YEARASHPAY_MONTH',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_YEARASHPAY_MONTH ? `${record?.MOM_YEARASHPAY_MONTH}%` : '-'
          }
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比率</div>,
          width: 120,
          dataIndex: 'MOM_YEARASHPAY_YEAR',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_YEARASHPAY_YEAR ? `${record?.MOM_YEARASHPAY_YEAR}%` : '-'
          }
        },
      ]
    },
    {
      title: '销售数量',
      dataIndex: '',
      hideInSearch: true,
      children: [
        {
          title: <div style={{ textAlign: 'center' }}>本期</div>,
          width: 120,
          dataIndex: 'TOTALCOUNT_CURR',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比</div>,
          width: 120,
          dataIndex: 'TOTALCOUNT_MONTH',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比</div>,
          width: 120,
          dataIndex: 'TOTALCOUNT_YEAR',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true,
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比率</div>,
          width: 120,
          dataIndex: 'MOM_TOTALCOUNT_MONTH',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_TOTALCOUNT_MONTH ? `${record?.MOM_TOTALCOUNT_MONTH}%` : '-'
          }
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比率</div>,
          width: 120,
          dataIndex: 'MOM_TOTALCOUNT_YEAR',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_TOTALCOUNT_YEAR ? `${record?.MOM_TOTALCOUNT_YEAR}%` : '-'
          }
        },
      ]
    },
    {
      title: '客单数量',
      dataIndex: '',
      hideInSearch: true,
      children: [
        {
          title: <div style={{ textAlign: 'center' }}>本期</div>,
          width: 120,
          dataIndex: 'TICKETCOUNT_CURR',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比</div>,
          width: 120,
          dataIndex: 'TICKETCOUNT_MONTH',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比</div>,
          width: 120,
          dataIndex: 'TICKETCOUNT_YEAR',
          valueType: 'digit',
          align: 'right',
          hideInSearch: true,
        },
        {
          title: <div style={{ textAlign: 'center' }}>环比率</div>,
          width: 120,
          dataIndex: 'MOM_TICKETCOUNT_MONTH',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_TICKETCOUNT_MONTH ? `${record?.MOM_TICKETCOUNT_MONTH}%` : '-'
          }
        },
        {
          title: <div style={{ textAlign: 'center' }}>同比率</div>,
          width: 120,
          dataIndex: 'MOM_TICKETCOUNT_YEAR',
          hideInSearch: true,
          align: 'right',
          render: (_, record) => {
            return record?.MOM_TICKETCOUNT_YEAR ? `${record?.MOM_TICKETCOUNT_YEAR}%` : '-'
          }
        }
      ]
    },
  ]
  //   导出excel方法
  const exportTable = (e) => {
    e.stopPropagation();                                            // 防止Collapse组件收起
    const main = document.getElementsByClassName(`revenueYOYQOQReportHideBox${printIndex}`)[0]
    const thead = main.querySelector('thead').cloneNode(true);  // 深克隆DOM节点
    const tbody = main.querySelector('tbody').cloneNode(true);  // 深克隆DOM节点
    const container = document.querySelector('#hiddenBox');

    const tempTable = document.createElement('table');
    tempTable.appendChild(thead);
    tempTable.appendChild(tbody);

    tempTable.setAttribute('id', 'table-to-xls-revenueYOYQOQReport');                    // 给table添加id，值与按钮上的table字段对应

    container.appendChild(tempTable);                                // 把创建的节点添加到页面容器中

    setShowLoading(false)

    downloadBtnRef.current.handleDownload();
    setShowExportTable(false)
    tempTable.remove() // 防止重复打印一个内容
  }

  // 自营业态的选择的列表方法
  const handleGetShopNamesList = async (id: any) => {
    const req: any = {
      ProvinceCode: currentUser?.USER_PROVINCE,
      BusinessType: 1000,
      ServerpartId: id || selectedId
    }
    const data = await handleGetShopShortNamesGet(req)
    console.log('data', data)
    if (data && data.length > 0) {
      const obj: any = {}
      if (data && data.length > 0) {
        data.forEach((item: any) => {
          obj[item] = item
        })
      }
      setShopNamesList(obj)
    }
  }

  return (
    <div ref={(el) => {
      // 打印报表
      if (!reqDetailList || reqDetailList.length === 0) return;
      setPrintOut(el);
    }}>
      {
        showLoading ?
          <div
            style={{
              width: '100%',
              height: '100%',
              background: 'rgba(0,0,0,0.1)',
              position: 'fixed',
              zIndex: 5,
              display: 'flex',
              alignItems: 'center',
              justifyContent: 'center'
            }}
          >
            <div style={{
              display: 'flex',
              alignItems: 'center',
              justifyContent: 'center',
              padding: '15px 20px 10px',
              background: '#fff',
              borderRadius: '8px',
              width: '200px'
            }}>
              <Spin />
              <span style={{ marginLeft: '5px' }}>数据导出中...</span>
            </div>
          </div> : ''
      }

      <div className={`revenueYOYQOQReportHideBox${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
        {
          showExportTable && reqDetailList && reqDetailList.length > 0 ?
            <ProTable
              columns={columns}
              dataSource={reqDetailList}
              pagination={false}
              expandable={{
                defaultExpandAllRows: true
              }}
            /> : ''
        }
      </div>
      <div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
      <div style={{ backgroundColor: '#fff', display: 'flex' }}>
        <ProCard
          style={{ width: !collapsible ? "300px" : "60px" }}
          className="pageTable-leftnav"
          bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20, width: !collapsible ? "300px" : "60px" }}
          extra={<MenuFoldOutlined onClick={() => {
            setCollapsible(!collapsible)
          }} />}
          colSpan={!collapsible ? "300px" : "60px"}
          title={!collapsible ? "请选择服务区" : ""}
          headerBordered
          collapsed={collapsible}
        >
          {treeView && treeView.length > 0 ? <Tree
            checkable
            treeData={[{
              label: '全部',
              value: 0,
              key: '0-0',
              children: treeView
            }]}
            fieldNames={{
              title: "label",
              key: "key"
            }}
            blockNode
            defaultExpandedKeys={['0-0']}
            onCheck={(checkedKeys: React.Key[] | any, info) => {
              const selectedIds = info.checkedNodes.filter(n => n?.type === 1)
              setSelectedId(selectedIds.map(n => n?.value)?.toString() || '')
              handleGetShopNamesList(selectedIds.map(n => n?.value)?.toString() || '')
              // actionRef?.current?.reload()
              // getData(selectedIds.map(n => n?.value)?.toString() || '')
            }}
          // switcherIcon={<PlusOutlined />}
          /> : ''}
        </ProCard>
        <div style={{
          width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
          paddingTop: 0,
          paddingBottom: 0,
          paddingRight: 0
        }}>
          <ProTable
            actionRef={actionRef}
            formRef={formRef}
            rowKey={(record) => {
              return `${record?.index}-${record?.Id}-${record?.Name}-${record?.SERVERPART_ID}`
            }}
            columns={columns}
            bordered
            search={{
              span: 6,
              defaultCollapsed: false,
            }}
            scroll={{ x: 1700, y: 'calc(100vh - 470px)' }}
            headerTitle={<PageTitleBox props={props} />}
            request={async (params) => {
              if (isFirst) {
                setIsFirst(false)
                return
              }
              if (!selectedId) {
                message.error('请选择服务区')
                return
              }
              setSearchParams(params)
              handleCallLogs()
              const req = {
                ServerpartIds: selectedId || '',
                startDate: params?.StartDate,
                endDate: params?.EndDate,
                businessType: params?.businessType || '',// 经营模式
                ShowShop: params.ShowShop === '1',
                targetSystem: params.targetSystem || '',
                shopNames: params.shopNames || '',
                SearchKeyName: "MerchantName,Brand,Shop,Serverpart",
                SearchKeyValue: params?.SearchKeyValue || ''
              }
              const data = await handleGetGetRevenueYOYQOQ(req)
              console.log('data', data)
              let list: any = []

              if (data && data.length > 0) {
                list = JSON.parse(JSON.stringify(data))
                list.forEach((item: any, index: number) => {
                  item.index = index + 1
                  // CASHPAY_CURRSUM+=item.CASHPAY_CURR
                  // CASHPAY_MONTHSUM+=item.CASHPAY_MONTH
                  // CASHPAY_YEARSUM+=item.CASHPAY_YEAR
                  //
                  // TOTALCOUNT_CURRSUM+=item.TOTALCOUNT_CURR
                  // TOTALCOUNT_MONTHSUM+=item.TOTALCOUNT_MONTH
                  // TOTALCOUNT_YEARSUM+=item.TOTALCOUNT_YEAR
                  //
                  // TICKETCOUNT_CURRSUM+=item.TICKETCOUNT_CURR
                  // TICKETCOUNT_MONTHSUM+=item.TICKETCOUNT_MONTH
                  // TICKETCOUNT_YEARSUM+=item.TICKETCOUNT_YEAR

                  if (item.children && item.children.length > 0) {
                    item.children.forEach((subItem: any, subIndex: number) => {
                      subItem.index = subIndex + 1
                      if (subItem.children && subItem.children.length > 0) {
                        subItem.children.forEach((thirdItem: any, thirdIndex: number) => {
                          thirdItem.index = thirdIndex + 1
                          if (thirdItem.children && thirdItem.children.length > 0) {
                            thirdItem.children.forEach((fourthItem: any, fourthIndex: number) => {
                              fourthItem.index = fourthIndex + 1
                            })
                          }
                        })
                      }
                    })
                  }
                })
              }

              let fieldData: any = [
                "CASHPAY_CURR",
                "CASHPAY_MONTH",
                "CASHPAY_YEAR",
                "TOTALCOUNT_CURR",
                "TOTALCOUNT_MONTH",
                "TOTALCOUNT_YEAR",
                "TICKETCOUNT_CURR",
                "TICKETCOUNT_MONTH",
                "TICKETCOUNT_YEAR",
              ]


              let enumList: any = ["ShopTrade"]
              let newPrintData: any = formatTreeData(JSON.parse(JSON.stringify(list)), fieldData, enumList, [SHOPTRADEObj], ["MOM_YEARASHPAY_MONTH", "MOM_YEARASHPAY_YEAR", "MOM_TOTALCOUNT_MONTH", "MOM_TOTALCOUNT_YEAR", "MOM_TICKETCOUNT_MONTH", "MOM_TICKETCOUNT_YEAR"])


              setReqDetailList(newPrintData)
              return { data: list, success: true }
            }}
            pagination={false}
            toolbar={{
              actions: [
                // <span style={{ visibility: 'hidden' }}>
                //   <ReactHTMLTableToExcel
                //     buttonText={'导出excel'}
                //     ref={downloadBtnRef}
                //     table="table-to-xls-revenueYOYQOQReport"
                //     filename={`销售同环比分析_${searchParams?.StartDate}-${searchParams?.EndDate}`}
                //     sheet="sheet1"
                //   />
                // </span>,
                <Button
                  key="new"
                  type="primary"
                  onClick={(e) => {
                    if (reqDetailList && reqDetailList.length > 0) {
                      // 尝试一下 导出新方法 
                      exportXlsxFromProColumnsExcelJS(columns,
                        reqDetailList,
                        `销售同环比分析_${searchParams?.StartDate}-${searchParams?.EndDate}`,
                        // {
                        //   topTitle: `历史销售单品报表`, // 顶部大标题
                        // }
                      )
                    } else {
                      message.error('暂无数据可导出！')
                    }

                    // if (reqDetailList && reqDetailList.length > 0) {
                    //   setShowLoading(true)
                    //   setTimeout(() => {
                    //     setShowExportTable(true)
                    //     setTimeout(() => {
                    //       exportTable(e)
                    //     }, 100)
                    //   }, 100)
                    // } else {
                    //   message.error('暂无数据可导出！')
                    // }
                  }}
                >
                  导出excel
                </Button>
              ]
            }}
            columnsState={{
              value: columnsStateMap,
              onChange: setColumnsStateMap,
            }}
          />
        </div>
      </div>

      <Drawer
        width="80%"
        visible={showDailyDrawer}
        onClose={() => {
          setCurrentRow(undefined);
          setShowDailyDrawer(false);
        }}
        bodyStyle={{ backgroundColor: "#f9f9f9", padding: 16 }}
        destroyOnClose
        closable={false}
      >
        <div style={{ width: '100%' }}>
          {/* { */}
          {/*   amountReceivedData && amountReceivedData.length>0? */}
          {/*     <CarTrafficChart data={amountReceivedData} type={1}/> */}
          {/*     :'' */}
          {/* } */}
          {/* { */}
          {/*   salesQuantityData && salesQuantityData.length>0? */}
          {/*     <CarTrafficChart data={salesQuantityData} type={2}/> */}
          {/*     :'' */}
          {/* } */}
          {/* { */}
          {/*   customerOrdersData && customerOrdersData.length>0? */}
          {/*     <CarTrafficChart data={customerOrdersData} type={3}/> */}
          {/*     :'' */}
          {/* } */}

          <ProTable
            actionRef={actionByDateRef}
            formRef={formByDateRef}
            rowKey={(record) => {
              return `${record?.index}-${record?.Id}-${record?.Name}-${record?.SERVERPART_ID}`
            }}
            columns={columns}
            bordered
            search={false}
            options={false}
            pagination={false}
            headerTitle={currentRow?.Name === '合计' ? '合计' : `${currentRow?.SPREGIONTYPE_NAME}${currentRow?.SERVERPART_NAME ? `-${currentRow?.SERVERPART_NAME}` : ''}${currentRow?.SHOPNAME ? `-${currentRow?.SHOPNAME}` : ''}`}
            request={async (params) => {
              console.log('currentRow', currentRow)
              const req = {
                ServerpartIds: currentRow?.SHOPID ? '' : currentRow?.Id,
                ServerpartShopId: currentRow?.SHOPID ? currentRow?.SHOPID : '',
                startDate: searchParams?.StartDate,
                endDate: searchParams?.EndDate,
                businessType: searchParams?.businessType || '',// 经营模式
                // ShowShop: searchParams.ShowShop==='1',
                targetSystem: searchParams.targetSystem || '',
                shopNames: searchParams.shopNames || '',
                SearchKeyName: "MerchantName,Brand,Shop,Serverpart",
                SearchKeyValue: searchParams?.SearchKeyValue || ''
              }
              const data = await handleGetGetRevenueYOYQOQByDate(req)
              console.log('data22222', data)
              if (data && data.length > 0) {
                // 实收金额数组
                const amountReceivedList: any = []
                // 销售数量数组
                const salesQuantity: any = []
                // 客单数量数组
                const customerOrders: any = []

                data.forEach((item: any) => {
                  if (item.children && item.children.length > 0) {
                    item.children.forEach((subItem: any) => {
                      amountReceivedList.push({ time: subItem.Name, value: subItem.CASHPAY_CURR, category: '本期实收金额' })
                      amountReceivedList.push({ time: subItem.Name, value: subItem.CASHPAY_MONTH, category: '本期环比' })
                      amountReceivedList.push({ time: subItem.Name, value: subItem.CASHPAY_YEAR, category: '本期同比' })

                      salesQuantity.push({ time: subItem.Name, value: subItem.TOTALCOUNT_CURR, category: '本期销售数量' })
                      salesQuantity.push({ time: subItem.Name, value: subItem.TOTALCOUNT_MONTH, category: '本期环比' })
                      salesQuantity.push({ time: subItem.Name, value: subItem.TOTALCOUNT_YEAR, category: '本期同比' })

                      customerOrders.push({ time: subItem.Name, value: subItem.TICKETCOUNT_CURR, category: '本期客单数量' })
                      customerOrders.push({ time: subItem.Name, value: subItem.TICKETCOUNT_MONTH, category: '本期环比' })
                      customerOrders.push({ time: subItem.Name, value: subItem.TICKETCOUNT_YEAR, category: '本期同比' })
                    })
                  }


                })
                setAmountReceivedData(amountReceivedList)
                setSalesQuantityData(salesQuantity)
                setCustomerOrdersData(customerOrders)


                return { data, success: true }
              }
              return { data: [], success: true }

            }}
            scroll={{ x: 1700 }}
            columnsState={{
              value: columnsDailyStateMap,
              onChange: setColumnsDailyStateMap,
            }}
          />
        </div>
      </Drawer>
    </div>
  )
}

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