import { PlusOutlined } from '@ant-design/icons';
import { Popconfirm, Modal, Button, message, Input, Drawer } from 'antd';
import React, { useEffect, useState, useRef } from 'react';
import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
// import CreateForm from './CreateMemberInfoForm';
import api from '../services';

const key = 'message';

const memberInfoListManage = (props) => {
  /** 新建/更新窗口的弹窗 */
  const [createModalVisible, handleModalVisible] = useState(false);
  const actionRef = useRef();
  const [currentRow, setCurrentRow] = useState();
  const [selectedRowsState, setSelectedRows] = useState([]);

  //分配会员

  function pushMemberTagInfo(value) {
    try {
      api
        .AddOrUpdateMemberTagInfo({
          ids: selectedRowsState.map((item, index) => item.id),
          memberTag_Id: props.values.id,
          platformType: value.platformType,
        })
        .then((r) => {
          if (r.data) {
            message.success('分配会员成功!!!!');
          } else {
            message.error('分配会员失败，请重试');
          }
        });
      //刷新数据
      actionRef.current.reloadAndRest();
      return true;
    } catch (error) {
      message.error('分配会员失败，请重试');
    }
  }
  const columns = [
    {
      title: '主键',
      dataIndex: 'id',
      hideInSearch: true,
      hideInTable: true,
      tip: '规则名称是唯一的 key',
    },
    {
      title: '头像',
      dataIndex: 'headImgUrl',
      search: false,
      hideInForm: true,
      render: (_, record) => (
        <img src={record.headImgUrl} style={{ width: '45px', height: '45px' }}></img>
      ),
    },
    {
      title: '会员昵称',
      dataIndex: 'nickName',
      valueType: 'textarea',
    },
    {
      title: '真实姓名',
      dataIndex: 'realName',
      valueType: 'textarea',
    },
    {
      title: '性别',
      dataIndex: 'sex',
      search: false,
      valueEnum: {
        0: { text: '未知', status: 'Processing' },
        1: { text: '男', status: 'Processing' },
        2: { text: '女', status: 'Success' },
      },
    },
    {
      title: '电话',
      dataIndex: 'phone',
      valueType: 'textarea',
    },
    {
      title: '状态',
      dataIndex: 'status',
      valueEnum: {
        0: {
          text: '正常',
          status: 'Processing',
        },
        1: {
          text: '停用',
          status: 'Success',
        },
      },
    },
  ];

  return (
    <Modal
      width={1200}
      bodyStyle={{ padding: '32px 40px 48px' }}
      destroyOnClose
      title={(props.values == undefined ? '' : props.values.name) + '分配会员'}
      search={false}
      visible={props.memberInfoModalVisible}
      footer={false}
      onCancel={() => props.onCancel()}
      maskClosable={false}
      centered={true}
    >
      <PageContainer
        header={{
          title: '',
          breadcrumb: {},
        }}
      >
        <ProTable
          headerTitle="会员信息"
          actionRef={actionRef}
          rowKey="id"
          search={{
            labelWidth: 120,
          }}
          toolBarRender={() => [
            <Button
              type="primary"
              key="primary"
              onClick={() => {

                if (selectedRowsState.length == 0) {
                  message.error('请选择需要分配平台的会员的数据！！');
                } else {
                  //handleModalVisible(false);
                  var success = false;
                  var success = pushMemberTagInfo(props.values);
                  if (success) {
                    setSelectedRows([]);
                    handleModalVisible(false);
                    props.onCancel();
                  }
                }
              }}
            >
              分配
            </Button>,
          ]}
          request={async (params) => {
            var data = [];
            var total = 0;
            await api.GetMemberInfoPageAsync(params).then((r) => {
              data = r.data.data;
              total = r.data.total;
            });
            return {
              data: data,
              success: true,
              total: total,
            };
          }}
          columns={columns}
          rowSelection={{
            onChange: (_, selectedRows) => {
              setSelectedRows(selectedRows);
            },
          }}
        />
        {/* <CreateForm
          onFinish={async (value) => {
            var success = false;
            var success = pushMemberTagInfo(value);
            if (success) {
              handleModalVisible(false);
            }
          }}
          onCancel={() => {
            //分配数据
            handleModalVisible(false);
            setCurrentRow(undefined);
          }}
          createModalVisible={createModalVisible}
          values={currentRow || {}}
        /> */}
      </PageContainer>
    </Modal>
  );
};

export default memberInfoListManage;
