
import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Icon, Select, message, Table, Divider, Row, Col, 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 { Card, Avatar } from 'antd';
import request from '../../../utils/request'
import Styles from './style.less';


function confirm() {
  Modal.confirm({
    title: '确认停用该角色？',
    okText: '确认',
    cancelText: '取消',
    onOk() {
      console.log('OK');
    },
    onCancel() {
      console.log('Cancel');
    },
  });

}
function toEditRole() {
  router.push({
    pathname: '/staff/editRole',
    query: {
      a: 'b',
    },
  });
}


const dataSource = [
  {
    name: '置业顾问',
    status: '1',//显示停用
  },
  {
    name: '置业经理',
    status: '1',//停用
  },
];

const columns = [
  // {
  //   title: '商品图片',
  //   dataIndex: 'img',
  //   key: 'img',
  //   align: 'center',

  //   render: (text, record) => <img src={record.img} className={channels.touxiang} />,
  // },
  {
    title: '角色名称',
    dataIndex: 'name',
    key: 'name',
    align: 'center',
    render: text => <a>{text}</a>,
  },

  {
    title: '操作  ',
    dataIndex: 'status',
    key: 'status',
    align: 'center',

    render: () => <>
      <span style={{ color: '#1990FF', marginRight: '20px' }} onClick={confirm}>停用
      <Icon type="stop" className={styles.shoppingCart} style={{fontSize:14}}/>
      </span>
      <span style={{ color: '#FF925C' }} onClick={toEditRole}>编辑
      <Icon type="form" className={styles.edit} />
      </span>
    </>,

  },
];


const header = (props) => {




  return (
    <>
      <Button type="danger" className={styles.addBtn} onClick={toEditRole}>新增</Button>
      <div className={Styles.roletext}>

        <Table dataSource={dataSource} columns={columns} />
      </div>
    </>

  )
}
const WrappedHeader = Form.create({ name: 'header' })(header);

export default WrappedHeader