import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, DatePicker } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import styles from '../style/GoodsList.less';
import router from 'umi/router';
import moment from 'moment';
import SelectCity from '../../components/SelectButton/CitySelect'
import BuildSelect from '../../components/SelectButton/BuildSelect'

import request from '../../utils/request'

const { Option } = Select;
const { MonthPicker, RangePicker, WeekPicker } = DatePicker;

const header = (props) => {
  const [ data, setData ] = useState({})
//   const [page, changePage] = useState({})

  useEffect(() => {
    getList({ pageNum: 1, pageSize: 10 });
  },[])

  // 查询列表
  const getList = (params) => {
    request({
        url: '/api/admin/taCustomerMessage',
        method: 'GET',
        params: { ...params },
    }).then((data) => {
        console.log(data)
        setData(data)
    })
  }

  const columns = [
    {
      title: '电话号码',
      dataIndex: 'phone',
      key: 'phone',
      align: 'center',
    },
    {
      title: '留言内容',
      dataIndex: 'message',
      key: 'message',
      align: 'center',
    },
    {
      title: '创建时间',
      dataIndex: 'createDate',
      key: 'createDate',
      align: 'center',
      render: (x, row) => <><span>{moment(row.createDate).format('YYYY-MM-DD')}</span></>
    },
  ];
   
  
  const changePageNum = (pageNumber) => {
      getList({ pageNum: pageNumber, pageSize: 10 })
  }
 

  const { getFieldDecorator } = props.form
  return (

    <>
      <Table dataSource={data.records} columns={columns} pagination={false}/>
      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} />
      </div>
    </>
  )
}
const WrappedHeader = Form.create({ name: 'header' })(header);

export default WrappedHeader
