import React from 'react';
import { Avatar } from 'antd';
import apis from '../../../services/apis';
import WxDictSelect from '@/components/SelectButton/WxDictSelect';
import QueryTable from '@/components/QueryTable'

function costomerDrift(props) {

  const columns = [
    {
      title: '头像',
      dataIndex: 'avatarurl',
      key: 'avatarurl',
      align: 'center',
      render: (_, record) => <Avatar shape="square" src={record.avatarurl} size={64} icon="user" />,
    },
    {
      title: '姓名',
      dataIndex: 'nickname',
      key: 'nickname',
      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: 'sceneAlias',
      key: 'sceneAlias',
      align: 'center',
      render: (_, record) => <><span>{ record.sceneAlias ? record.sceneAlias : '其他'}</span></>,
    },
  ];

 const searchFields = [
  {
    name: 'sceneType',
    label: '用户来源',
    placeholder: '请选择用户来源',
    render: () => <WxDictSelect style={{width: 160}} />
  },
]
  return (
    <>
      <QueryTable
          rowKey="personId"
          api={apis.customer.drift}
          searchFields={searchFields}
          columns={columns}
        />

    </>
    
    
  )
}

export default costomerDrift