import React, { PureComponent, useMemo, useRef, useState } from 'react';
import { Avatar, Button } from 'antd';
import moment from 'moment';
import request from '../../../utils/request';
import apis from '../../../services/apis';
import QueryTable from '@/components/QueryTable';
import { router } from 'umi';
import AuthButton from '@/components/AuthButton';

/**
 *
 *
 * @param {*} props
 * @returns
 */

function Recommend() {

  const ref=useRef()
  const [exportLoding, setExportLoding] = useState(false);
  //详情页面弹窗配置
  function toAudit(row, type) {
    router.push({
      pathname: '/findRoom/addedValueService/audit',
      query: {
        id: row.id,
        type: type,
      },
    });
  }
  //   function toSee(cuurentId) {
  //     router.push({
  //       pathname: '/home/recommend/auditCopy',
  //       query: {
  //         id: cuurentId,
  //       },
  //     })

  //   }

  /**
   *导出数据（推荐用户）
   *
   */
  function exportRecommendCustomer() {
    setExportLoding(true);
    request({
      ...apis.searchHouse.exportHouse,
      responseType: 'blob',
      params: {
        ...ref.current.getSearchData,
      },
    })
      .then(response => {
        download(response);
      })
      .catch(error => {});
  }

  function download(data) {
    if (!data) {
      return;
    }
    const url = window.URL.createObjectURL(new Blob([data]));
    const link = document.createElement('a');
    link.style.display = 'none';
    link.href = url;
    link.setAttribute('download', '找房需求.xlsx');
    document.body.append(link);
    link.click();
    setExportLoding(false);
  }
  const columns = [
    {
      title: '头像',
      dataIndex: 'avatarurl',
      key: 'avatarurl',
      align: 'center',
      render: (_, record) => <Avatar shape="square" src={record.avatarurl} size={64} />,
    },
    {
      title: '姓名',
      dataIndex: 'nickname',
      key: 'nickname',
      align: 'center',
      // render: (_, record) => <><span>{record.name = '曹建芳'}</span></>,
    },
    {
      title: '电话',
      dataIndex: 'phone',
      key: 'phone',
      align: 'center',
    },
    {
      title: '性别',
      dataIndex: 'gender',
      key: 'gender',
      align: 'center',
      // eslint-disable-next-line no-nested-ternary
      render: (_, record) => (
        <>
          <span>{record.gender === '1' ? '男' : record.gender === '2' ? '女' : '未知'}</span>
        </>
      ),
    },
    {
      title: '房屋现状',
      dataIndex: 'intentArea', //意向区域
      key: 'intentArea',
      align: 'center',
      // render: (_, record) => <><span>{record.area = '江苏省南京市秦淮区'}</span></>,
      render: (_, record) => (
        <>
          <span>
            {JSON.parse(record.questionnaire)?.filter(x => x.key == 'houseStatus')[0]?.result}
          </span>
        </>
      ),
    },
    {
      title: '装修预算',
      dataIndex: 'maxPrice',
      key: 'maxPrice',
      align: 'center',
    },
    {
      title: '提交时间',
      dataIndex: 'createdTime',
      key: 'createdTime',
      align: 'center',
      render: (_, record) => (
        <>
          <span>
            {record.createdTime && moment(record.createdTime).format('YYYY-MM-DD HH:mm:ss')}
          </span>
        </>
      ),
    },
    {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      align: 'center',
      render: (_, record) => (
        <>
          <span>
            {record.status == '0'
              ? '待回访'
              : record.status == '1'
              ? '已回访'
              : record.status == '2'
              ? '无效'
              : ''}
          </span>
        </>
      ),
    },
    {
      title: '操作',
      dataIndex: 'customerId',
      key: 'customerId',
      align: 'center',

      render: (_, record) => (
        <>
          {record.status == '0' ? (
            <AuthButton name="house.added.reply" noRight={null}>
              <Button type="link" onClick={() => toAudit(record, 'edit')}>
                审核
              </Button>
            </AuthButton>
          ) : (
            <AuthButton name="house.added.detail" noRight={null}>
              <Button type="link" onClick={() => toAudit(record, 'detail')}>
                查看详情
              </Button>
            </AuthButton>
          )}
        </>
      ),
    },
  ];

  const searchFields = [
    {
      name: 'name',
      label: '姓名',
      placeholder: '请输入姓名',
    },
    {
      name: 'tel',
      label: '电话',
      placeholder: '请输入电话',
    },
    // {
    //   name: 'types',
    //   label: '类型',
    //   placeholder: '类型',
    //   type: 'select',
    //   options: [
    //     { label: '全部', value: '' },
    //     { label: '买房', value: '1' },
    //     { label: '租房', value: '2' },
    //     { label: '海外', value: '3' }
    //   ]
    // },
    {
      name: 'verifyStatus',
      label: '状态',
      placeholder: '请选择状态',
      type: 'select',
      placeholder: '全部', //错误
      options: [
        { label: '全部', value: '' },
        { label: '待回访', value: '0' },
        { label: '已回访', value: '1' },
        { label: '无效', value: '2' },
      ],
    },
  ];
  const actionRender = () => {
    return (
      <Button type="danger" loading={exportLoding} onClick={() => exportRecommendCustomer()}>
        导出
      </Button>
    );
  };

  return (
    <>
      <QueryTable
        rowKey="id"
        ref={ref}
        api={apis.searchHouse.list}
        searchFields={searchFields}
        columns={columns}
        postData={data => {
          data.type = '4';
          return data;
        }}
        // actionRender={actionRender}
      />
    </>
  );
}

export default Recommend;