import type { CurrentUser } from "umi";
import { connect } from "umi";
import type { ConnectState } from "@/models/connect";
import type { ActionType } from "@ant-design/pro-table";
import ProTable from "@ant-design/pro-table";
import React, { useEffect, useRef, useState } from "react";
import type { FormInstance } from "antd";
import { Button, Drawer, message, Space, Image, Popconfirm, Upload } from "antd";
import './style.less'
import ProForm, { ProFormSelect, ProFormText, ProFormTextArea, ProFormUploadButton, ProFormTreeSelect } from "@ant-design/pro-form";
import {
  handleApplyBIDProinst, handleGetApproveBIDProinst, handleGetBUSINESSAPPROVALDetail,
  handleGetBusinessProcessList, handleGetRejectBIDProinst, handleGetSupplierDDL,
  handleGetWAREHOUSEList, handleGetWAREHOUSETree,
  handleSynchroBUSINESSAPPROVAL
} from "@/pages/market/marketResearch/service";
import { getServerpartTree } from "@/services/options";
import moment from "moment/moment";
import { deletePicture, GetPictureList, handleUploadPicture } from "@/pages/supplier/inspectionReport/service";
import fileIcon from '@/assets/fileIcon.svg'
import LoadingBox from "@/pages/reports/Finance/businessAnalysis/components/loading";
import { handleGetAPPROVALROUTEDetail } from "@/pages/reports/revenueConfirmation/components/service";
import { handleGetBIZPSPLITMONTHDetail } from "@/pages/examine/monthSettlement/service";
import { handleGetAPPROVALROUTEList } from "@/pages/Setting/serviceConfig/service";
import { handleGetGetBUSINESSAPPROVALDetail } from "@/pages/reports/ShopExpenseDetail/service";
import ReviewProcess from "@/pages/reports/revenueConfirmation/components/ReviewProcess";


const marketResearch: React.FC<{ currentUser: CurrentUser }> = (props) => {
  const { currentUser } = props
  const actionRef = useRef<ActionType>();
  const formRef = useRef<FormInstance>();
  const detailFormRef = useRef<FormInstance>();

  // 上传附件的抽屉
  const [showDrawer, setShowDrawer] = useState<boolean>(false)
  // 选择的行数据 
  const [currentRow, setCurrentRow] = useState<any>()
  // 附件列表
  const [fileList, setFileList] = useState<any>()
  // 附件列表的加载效果
  const [fileListLoading, setFileListLoading] = useState<boolean>(false)
  // 服务区 管理处的选择列表
  const [serviceSelectList, setServiceSelectList] = useState<any>()
  const [managerSelectList, setManagerSelectList] = useState<any>()
  // 是否显示审批人选择框
  const [showSelectPerson, setShowSelectPerson] = useState<boolean>(false)
  // 选择的服务区
  const [selectServerpart, setSelectServerpart] = useState<any>()
  // 选择的管理处
  const [selectManagerId, setSelectManagerId] = useState<any>()
  const [getType, setGetType] = useState<number>(0) // 3为查看详情
  const [proinstRow, setProinstRow] = useState<any>()
  const [showDescModal, setShowDescModal] = useState<boolean>(false)
  // 流程状态
  const [isMerchantState, setIsMerchantState] = useState<string>('')
  // 审批人数组
  const [APPROVALSTAFFIDList, setAPPROVALSTAFFIDList] = useState<any>()
  // 判断是否有驳回状态, 有驳回按照驳回的走 没驳回直接1000的驳回
  const [handleHaveReject, setHandleHaveReject] = useState<boolean>(false)
  // 审批环节数组
  const [stateList, setStateList] = useState<any>()
  // 显示审核流程抽屉
  const [showReviewProcess, setShowReviewProcess] = useState<boolean>(false)

  const columns: any = [
    {
      title: '业务名称',
      dataIndex: 'BusinessProcess_Name',
      width: 250,
      ellipsis: true,
      render: (_, record) => {
        return <a onClick={async () => {
          const data = await handleGetBUSINESSAPPROVALDetail({ BUSINESSAPPROVALId: record?.BusinessApproval_ID })
          setGetType(3)
          setProinstRow(record)
          const res = data
          if (res.SERVERPART_IDS && res.SERVERPART_IDS.indexOf(',') !== -1) {
            const [serverid, managerid] = res.SERVERPART_IDS.split(',')
            res.Serverpart_ID = Number(serverid)
            res.managerId = Number(managerid)
          }
          setCurrentRow({
            ...record,
            ...res,
            APPROVALSTAFF_ID: `${res.APPOVED_NAME}-${res.APPOVED_IDS}`,
            BusinessApprovalId: record?.BusinessApproval_ID
          })
          console.log('CurrentRow', {
            ...record,
            ...res,
          })
          setShowDrawer(true)
        }}>{record?.BusinessProcess_Name}</a>
      }
    },
    {
      title: '审批环节',
      dataIndex: 'BusinessProcess_State',
      valueType: 'select',
      width: 150,
      ellipsis: true,
      request: async () => {
        const req: any = {
          SearchParameter: {
            APPROVALROUTE_VALID: 1,
            OPERATION_TYPES: 13
          },
          PageIndex: 1,
          PageSize: 999999
        }
        const data = await handleGetAPPROVALROUTEList(req)
        console.log('data', data)
        if (data && data.length > 0) {
          const list: any = []
          let merchantState: string = ''
          data.forEach((item: any) => {
            if (item.USER_PATTERN === 2000) {
              if (merchantState) {
                merchantState += `,${item.APPROVALROUTE_STATE}`
              } else {
                merchantState = item.APPROVALROUTE_STATE
              }
            }
            list.push({ label: item.APPROVALROUTE_NAME, value: item.APPROVALROUTE_STATE })
          })
          setIsMerchantState(merchantState)
          setStateList(list)
          return list
        }
        return []
      }
    },
    {
      title: '统计时间',
      dataIndex: 'search_date',
      valueType: 'dateRange',
      hideInTable: true,
      hideInDescriptions: true,
      search: {
        transform: (value) => {
          return {
            StartDate: value[0],
            EndDate: value[1],
          };
        },
      },
      fieldProps: {
        disabledDate: (current: any) => current && current > moment().endOf('day')
      }
    },
    {
      title: '服务区名称',
      dataIndex: 'Serverpart_Name',
      width: 130,
      ellipsis: true,
      hideInSearch: true,
      render: (_, record) => {
        return record?.Serverpart_Name ? record?.Serverpart_Name.split(',')[0] : ''
      }
    },
    {
      title: '管理处名称',
      dataIndex: '管理处名称',
      width: 130,
      ellipsis: true,
      hideInSearch: true,
      render: (_, record) => {
        return record?.Serverpart_Name ? record?.Serverpart_Name.split(',')[1] : ''
      }
    },

    {
      title: '备注说明',
      dataIndex: 'BusinessProcess_Desc',
      width: 300,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '供应商名称',
      dataIndex: 'BusinessProcess_ID',
      width: 200,
      ellipsis: true,
      hideInSearch: true,
      valueType: 'select',
      request: async () => {
        const req: any = {
          ProvinceCode: currentUser?.ProvinceCode
        }
        const data = await handleGetSupplierDDL(req)
        return data
      }
    },
    {
      title: '申请人',
      dataIndex: 'Staff_Name',
      width: 100,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '待审核人',
      width: 100,
      dataIndex: 'ApproveStaff_Name',
      ellipsis: true,
      hideInSearch: true,
    },
    {
      title: '申请时间',
      dataIndex: 'BusinessProcess_StartDate',
      width: 150,
      ellipsis: true,
      hideInSearch: true,
    },
    {
      dataIndex: 'option',
      title: '操作',
      width: 120,
      valueType: 'option',
      align: 'center',
      hideInSearch: true,
      render: (_, record) => {
        return (
          <Space>
            <Popconfirm
              title="确认通过审核？"
              onConfirm={async () => {
                const data = await handleGetBUSINESSAPPROVALDetail({ BUSINESSAPPROVALId: record?.BusinessApproval_ID })
                setGetType(1)
                setProinstRow(record)
                const res = data
                if (res.SERVERPART_IDS && res.SERVERPART_IDS.indexOf(',') !== -1) {
                  const [serverid, managerid] = res.SERVERPART_IDS.split(',')
                  res.Serverpart_ID = Number(serverid)
                  res.managerId = Number(managerid)
                }
                setCurrentRow({
                  ...record,
                  ...res,
                  APPROVALSTAFF_ID: `${res.APPOVED_NAME}-${res.APPOVED_IDS}`,
                  BusinessApprovalId: record?.BusinessApproval_ID
                })
                console.log('CurrentRow', {
                  ...record,
                  ...res,
                })
                setShowDrawer(true)
              }}
            >
              <a>审核</a>
            </Popconfirm>
            <Popconfirm
              title="确认驳回？"
              onConfirm={async () => {
                const data = await handleGetBUSINESSAPPROVALDetail({ BUSINESSAPPROVALId: record?.BusinessApproval_ID })
                setGetType(2)
                setProinstRow(record)
                const res = data
                if (res.SERVERPART_IDS && res.SERVERPART_IDS.indexOf(',') !== -1) {
                  const [serverid, managerid] = res.SERVERPART_IDS.split(',')
                  res.Serverpart_ID = Number(serverid)
                  res.managerId = Number(managerid)
                }
                setCurrentRow({
                  ...record,
                  ...res,
                  APPROVALSTAFF_ID: `${res.APPOVED_NAME}-${res.APPOVED_IDS}`,
                  BusinessApprovalId: record?.BusinessApproval_ID
                })
                console.log('CurrentRow', {
                  ...record,
                  ...res,
                })
                setShowDrawer(true)
              }}
            >
              <a>驳回</a>
            </Popconfirm>
          </Space>
        )
      }
    }
  ]

  // 上传图片方法
  const handleUpFile = async (id: string, file: any) => {
    if (file && file.length > 0) {
      const formData = new FormData()
      file.forEach((item: any) => {
        formData.append('files[]', item.originFileObj)
      })
      formData.append('TableId', id)
      formData.append('TableType', '1128')
      const data = await handleuploadAHYDPicture(formData)
      console.log('data', data)
    }
  }

  // 查询图片列表
  const handleGetPictureList = async (id: string) => {
    setFileListLoading(true)
    const req: any = {
      TableId: id,
      TableType: 1128,
    }
    const data = await GetPictureList(req)
    console.log('data', data)
    setFileList(data)
    setFileListLoading(false)
  }

  // 获得审批人列表的方法
  const handleGetPersonList = async (serverpartId: any, managerId: any) => {
    if (serverpartId && managerId) {
      const id: string = `${serverpartId},${managerId}`
      const req: any = {
        OperationType: 13,
        CurState: 1000,
        IsValid: 1,
        ShowApprovalUser: true,
        ServerpartIds: id,
      }
      const data = await handleGetAPPROVALROUTEDetail(req)
      const list: any = []
      if (data.UserList && data.UserList.length > 0) {
        data.UserList.forEach((item: any) => {
          if (item.USER_STATUS === 1) {
            list.push({ label: item.USER_NAME, value: `${item.USER_NAME}-${item.USER_ID}` })
          }
        })
      }

      setAPPROVALSTAFFIDList(list)
    }
  }

  // 审核是1  驳回是2
  const handleGetToExamine = async (res: any) => {
    let req: any = {}
    let data: any = {}
    // 审核
    if (getType === 1) {
      req = {
        businessApprovalID: currentRow?.BUSINESSAPPROVAL_ID,
        curProinstState: currentRow?.BUSINESSAPPROVAL_STATE,
        approveedInfo: res.desc,
        approveedStaffId: currentUser?.ID,
        approveedStaffName: currentUser?.Name,
        nextId: res.nextPerson,
      }
      data = await handleGetApproveBIDProinst(req)
    } else if (getType === 2) {
      //   驳回
      const backObj = JSON.parse(res.targetProinstState)
      req = {
        businessApprovalID: currentRow?.BUSINESSAPPROVAL_ID,
        approveedStaffId: backObj?.APPROVALSTAFF_ID,
        approveedStaffName: backObj?.APPROVALSTAFF_NAME,
        approveedInfo: res.desc,
        targetProinstState: backObj?.APPROVALROUTE_STATE
      }
      data = await handleGetRejectBIDProinst(req)
    }
    console.log('data', data)
    if (data.Result_Code === 100) {
      message.success(data.Result_Desc)
      detailFormRef.current?.resetFields()
      setCurrentRow(undefined)
      setFileList([])
      setShowDrawer(false)
      setGetType(0)
      actionRef.current?.reload()
    } else {
      message.error(data.Result_Desc)
    }
  }


  useEffect(() => {
    if (showDrawer) {
      // 拿到下一阶段人的数据
      handleGetPersonList(currentRow?.Serverpart_ID, currentRow?.managerId)
      // 图片的数组
      if (currentRow) {
        handleGetPictureList(currentRow?.BUSINESSAPPROVAL_ID)
      }
    }
  }, [showDrawer]);


  return (
    <div>
      <ProTable
        actionRef={actionRef}
        formRef={formRef}
        columns={columns}
        bordered
        request={async (params: any) => {
          console.log('params', params)
          const req: any = {
            SearchParameter: {
              // ...params,
              // Staff_ID: currentUser.ID,
              BusinessProcess_StateSearch: params?.BusinessProcess_State || '',
              Operation_Type: 13,
              SortStr: "BusinessProcess_StartDate desc",
              BusinessProcess_StartDate: params.StartDate || '',
              BusinessProcess_EndDate: params.EndDate || '',
            },
            keyWord: {
              Key: 'BusinessProcess_Name',
              Value: params?.BusinessProcess_Name || ''
            }
          }
          const data = await handleGetBusinessProcessList(req)
          if (data && data.length > 0) {
            return { data, success: true }
          }
          return { data: [], success: true }
        }}
        toolbar={{
          actions: [
            <Button type={'primary'} onClick={() => {
              setShowDrawer(true)
            }}>新增审批申请</Button>
          ]
        }}
      />

      <Drawer
        width="80%"
        className={'marketResearch'}
        visible={showDrawer} // 抽屉弹框是否显示状态
        onClose={() => { // 关闭抽屉 设置抽屉状态为关闭
          detailFormRef.current?.resetFields()
          setCurrentRow(undefined)
          setFileList([])
          setShowDrawer(false)
          setGetType(0)
        }}
        destroyOnClose
        closable={false}
      >
        <div className={'drawerBox'}>
          <div className={'drawerBoxTop'}>附件上传</div>
          <div className={'drawerContent'}>
            <div className={'contentLeft'}>
              <ProForm
                formRef={detailFormRef}
                submitter={{
                  // 清空表单自带的按钮
                  render: (props, doms) => {
                    return []
                  }
                }}
                initialValues={currentRow}
              >
                {
                  getType === 3 ?
                    <ProFormTreeSelect
                      label={'审批环节'}
                      name={'BusinessProcess_State'}
                      readonly
                      fieldProps={{
                        options: stateList
                      }}
                    />
                    : ''
                }


                <ProFormText
                  label={'业务名称'}
                  name={'BusinessProcess_Name'}
                  readonly={getType > 0}
                  rules={[
                    {
                      required: true,
                      message: '请输入业务名称'
                    }
                  ]}
                />

                <ProFormTreeSelect
                  label={'服务区'}
                  name={'Serverpart_ID'}
                  readonly={getType > 0}
                  rules={[
                    {
                      required: true,
                      message: '请选择服务区'
                    }
                  ]}
                  fieldProps={{
                    treeDefaultExpandAll: true,
                    fieldNames: {
                      title: "label",
                    },
                    // showSearch: true,
                    onChange: (e: any) => {
                      if (e) {
                        setSelectServerpart(e)
                        handleGetPersonList(e, selectManagerId)
                      } else {
                        setSelectServerpart(null)
                      }
                    }
                  }}
                  request={async () => {
                    const req: any = {
                      wareHouseType: 2,
                      showSite: false
                    }
                    const data = await handleGetWAREHOUSETree(req)
                    setServiceSelectList(data)
                    if (data && data.length > 0) {
                      return data
                    }
                    return []
                  }}
                />

                <ProFormTreeSelect
                  label={'管理处'}
                  name={'managerId'}
                  readonly={getType > 0}
                  fieldProps={{
                    treeDefaultExpandAll: true,
                    fieldNames: {
                      title: "label",
                    },
                    // showSearch: true,
                    // options: serviceSelectList,
                    onChange: (e: any) => {
                      if (e) {
                        setSelectManagerId(e)
                        handleGetPersonList(selectServerpart, e)
                      } else {
                        setSelectManagerId(null)
                      }
                    }
                  }}
                  request={async () => {
                    if (getType > 0) {
                      const id = currentRow?.SERVERPART_IDS.split(',')[1] || ''
                      const name = currentRow?.SERVERPART_NAME.split(',')[1] || ''
                      return [{ label: name, value: id }]
                    }
                    const req: any = {
                      wareHouseType: 1,
                      showSite: false
                    }
                    const data = await handleGetWAREHOUSETree(req)
                    setManagerSelectList(data)
                    if (data && data.length > 0) {
                      return data
                    }
                    return []

                  }}
                  rules={[
                    {
                      required: true,
                      message: '请选择管理处'
                    }
                  ]}
                />

                {
                  getType === 3 ?
                    <ProFormText
                      label={'申请人'}
                      name={'Staff_Name'}
                      readonly
                    /> : ''
                }

                {
                  selectServerpart && selectManagerId || getType > 0 ?
                    <ProFormSelect
                      name="APPROVALSTAFF_ID"
                      label={getType === 3 ? '待审批人' : '审批人'}
                      readonly={getType > 0}
                      rules={[
                        {
                          required: true,
                          message: '请选择审批人'
                        }
                      ]}
                      fieldProps={{
                        options: APPROVALSTAFFIDList
                      }}
                    /> : ''
                }

                <ProFormTextArea
                  label={'备注说明'}
                  name={'BUSINESSAPPROVAL_DESC'}
                  readonly={getType > 0}
                />

                {/* 要驳回的状态 */}
                {
                  getType === 2 ?
                    <ProFormSelect
                      name="targetProinstState"
                      label="回退状态"
                      rules={[
                        {
                          required: handleHaveReject,
                          message: '请选择回退状态'
                        }
                      ]}
                      request={async () => {
                        const req: any = {
                          BUSINESSAPPROVALId: currentRow?.BUSINESSAPPROVAL_ID
                        }
                        const data = await handleGetBUSINESSAPPROVALDetail(req)
                        if (data.rejectList && data.rejectList.length > 0) {
                          setHandleHaveReject(true)

                          const list: any = []

                          data.rejectList.forEach((item: any) => {
                            list.push({ label: item.APPROVALROUTE_NAME, value: JSON.stringify(item) })
                          })
                          return list
                        }
                        setHandleHaveReject(false)
                        return []
                      }}
                    /> : ''
                }


                {
                  getType === 1 && currentRow?.NextState !== 9000 && currentRow?.BUSINESSAPPROVAL_STATE !== 9000 ?
                    <ProFormSelect
                      name={"nextPerson"}
                      label={"下一环节审批人"}
                      rules={[
                        {
                          required: true,
                          message: '请选择下一环节审批人'
                        }
                      ]}
                      request={async () => {
                        // merchantState 判断哪几个状态是商户的 商户调用拿到 商户下面的全部人列表选择一个  不是商户的 就根据选择了的人去指定一个人
                        // 接口直接返回就不用判断了
                        const req: any = {
                          BUSINESSAPPROVALId: currentRow?.BUSINESSAPPROVAL_ID
                        }
                        const data = await handleGetBUSINESSAPPROVALDetail(req)
                        const list: any = []
                        if (data.UserList && data.UserList.length > 0) {
                          data.UserList.forEach((item: any) => {
                            if (item.USER_STATUS === 1) {
                              list.push({ label: item.USER_NAME, value: item.USER_ID })
                            }
                          })
                        }
                        return list
                      }}
                    />
                    : ''
                }


                {
                  getType > 0 ?
                    getType === 3 ? '' :
                      <ProFormTextArea
                        label={getType === 1 ? '审核说明' : getType === 2 ? '驳回说明' : ''}
                        name={'desc'}
                        rules={[
                          {
                            required: true,
                            message: '请输入审核说明'
                          }
                        ]}
                      />
                    : <ProFormUploadButton
                      label={'上传附件'}
                      name={'file'}
                      readonly={getType > 0}
                      fieldProps={{
                        name: 'file',
                        beforeUpload: (file: any) => {
                          const isEXE = file.type === 'application/octet-stream'
                          if (isEXE) {
                            message.error(`不支持上传exe文件！`);
                          }
                          return !isEXE || Upload.LIST_IGNORE;
                        }
                      }}
                    />
                }


                {
                  getType === 0 ?
                    <div style={{ width: '100%', display: 'flex', justifyContent: 'flex-start' }}>
                      <Button type={'primary'} style={{ marginRight: '16px' }} onClick={() => {
                        detailFormRef.current?.validateFields().then(async (res: any) => {
                          if (res) {
                            let serviceName: string = ''
                            let managerName: string = ''
                            // 因为要服务区和管理处的中文名字 所以遍历一下拿出来
                            if (serviceSelectList && serviceSelectList.length > 0) {
                              serviceSelectList.forEach((item: any) => {
                                if (item.value === res.Serverpart_ID) {
                                  serviceName = item.label
                                } else {
                                  if (item.children && item.children.length > 0) {
                                    item.children.forEach((subItem: any) => {
                                      if (subItem.value === res.Serverpart_ID) {
                                        serviceName = subItem.label
                                      } else {
                                        if (subItem.children && subItem.children.length > 0) {
                                          subItem.children.forEach((thirdItem: any) => {
                                            serviceName = thirdItem.label
                                          })
                                        }
                                      }
                                    })
                                  }
                                }
                              })
                            }
                            if (managerSelectList && managerSelectList.length > 0) {
                              managerSelectList.forEach((item: any) => {
                                if (item.value === res.managerId) {
                                  managerName = item.label
                                }
                              })
                            }

                            let [APPOVED_IDS, APPOVED_NAME] = []
                            if (res.APPROVALSTAFF_ID) {
                              [APPOVED_NAME, APPOVED_IDS] = res.APPROVALSTAFF_ID.split('-')
                            }

                            const req: any = {
                              ACCEPT_CODE: `13-${currentUser.SupplierID}`,
                              BUSINESS_STARTDATE: moment().format('YYYY-MM-DD HH:mm:ss'),
                              BUSINESSAPPROVAL_STATE: 2000,
                              OPERATION_TYPE: 13,
                              BUSINESSPROCESS_NAME: res.BusinessProcess_Name,
                              // SERVERPART_ID: res.Serverpart_ID,
                              SERVERPART_IDS: `${res.Serverpart_ID},${res.managerId}`,
                              SERVERPART_NAME: `${serviceName},${managerName}`,
                              // BUSINESSAPPROVAL_STATE: 1000,
                              BUSINESSAPPROVAL_DESC: res.BUSINESSAPPROVAL_DESC,
                              STAFF_ID: currentUser.ID,
                              STAFF_NAME: currentUser.Name,
                              BUSINESSPROCESS_ID: currentUser.SupplierID,
                              APPOVED_IDS,
                              APPOVED_NAME
                            }
                            const data = await handleSynchroBUSINESSAPPROVAL(req)
                            if (data.Result_Code === 100) {
                              const result = data.Result_Data
                              message.success(data.Result_Desc)
                              // setCurrentRow({BusinessApproval_ID: result?.BUSINESSAPPROVAL_ID})
                              await handleUpFile(result?.BUSINESSAPPROVAL_ID, res.file)
                              // await handleGetPictureList(result?.BUSINESSAPPROVAL_ID)
                              // detailFormRef.current.setFieldsValue({file: []})
                              detailFormRef.current?.resetFields()
                              setCurrentRow(undefined)
                              setFileList([])
                              setShowDrawer(false)
                              actionRef.current?.reload()
                            } else {
                              message.error(data.Result_Desc)
                            }
                          }
                        })
                      }}>提交</Button>
                      <Button onClick={() => {
                        detailFormRef.current?.resetFields()
                        setCurrentRow(undefined)
                        setFileList([])
                        setShowDrawer(false)
                        setGetType(0)
                      }}>取消</Button>
                    </div> : getType > 0 ?
                      <div style={{ width: '100%', display: 'flex', justifyContent: 'flex-start' }}>
                        <Button type={'primary'} onClick={() => {
                          detailFormRef.current?.validateFields().then(async (res: any) => {
                            if (res) {
                              handleGetToExamine(res)
                            }
                          })
                        }}>
                          {getType === 1 ? '审核通过' : getType === 2 ? '驳回' : ''}
                        </Button>
                      </div> : ''
                }
              </ProForm>

              {
                getType > 0 ?
                  <Button type={'primary'} style={{ marginTop: '24px' }} onClick={() => {
                    console.log('currentRow', currentRow)
                    setShowReviewProcess(true);
                  }}>查看流程进度</Button> : ''
              }
            </div>
            <div className={'contentRight'}>
              <p className={'fileListTitle'}>附件列表</p>
              {
                fileListLoading ? <LoadingBox /> :
                  <div className={'imgListBox'}>
                    {
                      fileList && fileList.length > 0 ?
                        fileList.map((item: any) => {
                          return <div className={'imgItem'}>
                            {
                              item.ImageUrl.indexOf('.png') !== -1 || item.ImageUrl.indexOf('.jpg') !== -1 || item.ImageUrl.indexOf('.jpeg') !== -1 ?
                                <Image width={200} height={200} className={'imgBox'} src={item.ImageUrl} /> :
                                <div className={'otherFile'}>
                                  <img className={'fileIcon'} src={fileIcon} />
                                  <a onClick={() => {
                                    window.open(item.ImageUrl)
                                  }}>{item.ImageName || ''}</a>
                                </div>
                            }
                            {/* <div className={'deleteBtnBox'}> */}
                            {/*   <Popconfirm */}
                            {/*     title="确认删除？" */}
                            {/*     onConfirm={async () => { */}
                            {/*       const data = await deletePicture(item.ImagePath, item.ImageId, '', 9000) */}
                            {/*       if (data.Result_Code === 100) { */}
                            {/*         message.success('删除成功！') */}
                            {/*         handleGetPictureList(currentRow?.BusinessApproval_ID) */}
                            {/*       } else { */}
                            {/*         message.error(data.Result_Desc) */}
                            {/*       } */}
                            {/*     }} */}
                            {/*   > */}
                            {/*     <Button type={'danger'}>删除</Button> */}
                            {/*   </Popconfirm> */}
                            {/* </div> */}
                          </div>
                        }) : ''
                    }
                  </div>
              }
            </div>
          </div>
          {/* <div className={'drawerFooter'}> */}
          {/*   <Button style={{marginRight:'16px'}} onClick={()=>{ */}

          {/*   }}>取消</Button> */}
          {/*   <Button type={'primary'} onClick={()=>{ */}

          {/*   }}>提交</Button> */}
          {/* </div> */}
        </div>
      </Drawer>

      {/* 流程进度抽屉 */}
      <Drawer
        width="60%"
        className="project-drawer"
        visible={showReviewProcess} // 抽屉弹框是否显示状态
        onClose={() => { // 关闭抽屉 则在清空选中行数据 并 设置抽屉状态为关闭
          setShowReviewProcess(false);
        }}
        destroyOnClose
        bodyStyle={{ backgroundColor: "#f9f9f9", padding: 16 }}
        closable={false}
      >
        <ReviewProcess compareCurrent={currentRow} showReviewProcess={showReviewProcess} />
      </Drawer>


    </div>
  )
}

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