import React, { useState, useEffect } from 'react';
import { Radio, Modal, Form, Input, Button, Select, InputNumber, DatePicker, Alert } from 'antd';
import { GetCouponStatusOrType } from '../service';
const CreateForm = (props) => {
  const { Option, OptGroup } = Select;

  const [options, setoptions] = useState();

  const couponType = async () => { };

  //初始化数据
  useEffect(() => {
    const initcouponType = async (value) => { };
    initcouponType();
  }, []);

  const formItemLayout = {
    labelCol: {
      sm: { span: 4 },
    },
    wrapperCol: {},
  };
  const tailFormItemLayout = {
    wrapperCol: {
      sm: {
        offset: 1,
      },
    },
  };
  const onTimeTypeChange = (value) => { };

  return (
    <Modal
      title={props.values.id ? '编辑会员信息' : '新建会员信息'}
      width={700}
      maskClosable={false}
      visible={props.createModalVisible}
      // bodyStyle={{ padding: '32px 40px 48px' }}
      footer={null} //底部内容
      //取消
      onCancel={() => {
        props.onCancel();
      }}
      //关闭时销毁 Modal 里的子元素
      destroyOnClose
    >
      <Form
        {...formItemLayout}
        layout="Horizontal"
        preserve={false}
        initialValues={props.values}
        onFinish={props.onFinish}
      >
        <Form.Item name="id" hidden={true}>
          <Input />
        </Form.Item>
        <Form.Item name="platformType" hidden={true}>
          <Input />
        </Form.Item>
        <Form.Item name="memberInfo_Id" hidden={true}>
          <Input />
        </Form.Item>

        <Form.Item name="nickName" label="会员昵称" rules={[{ required: true, max: 200 }]}>
          <Input placeholder="请输入会员昵称" />
        </Form.Item>
        <Form.Item name="phone" label="电话号码"
          rules={[{ required: true, pattern: '^1[0-9]{10}$', message: '请输入正确的电话号码' }]}
        >
          <Input placeholder="" disabled={props.platformType == 0 ? true : false} />
        </Form.Item>

        <Form.Item
          noStyle
          shouldUpdate={(prevValues, currentValues) => prevValues.platformType !== currentValues.platformType}
        >
          {({ getFieldValue }) =>
            !getFieldValue('id') ? (
              <Form.Item name="platformType" disabled={true} label="平台" rules={[{ required: true }]} >
                <Select style={{ width: 120 }} >
                  <Option value="1" disabled>微信</Option>
                  <Option value="2" disabled>支付宝</Option>
                  <Option value="3">POS</Option>
                  <Option value="4">储值卡</Option>
                </Select>
              </Form.Item>
            ) : null
          }
        </Form.Item>

        <Form.Item name="headImgUrl" label="头像" rules={[{ max: 500 }]}>
          <Input placeholder="请输入会员昵称" />
        </Form.Item>

        <Form.Item style={{ height: 32 }}>
          <Form.Item name="birthday" label="出生日期" style={{ float: 'left', marginLeft: 40 }}>
            <DatePicker />
          </Form.Item>
          <Form.Item name="sex" label="性别" style={{ float: 'left', marginLeft: 110 }}>
            <Radio.Group>
              <Radio value={0}>未知</Radio>
              <Radio value={1}>男</Radio>
              <Radio value={2}>女</Radio>
            </Radio.Group>
          </Form.Item>
        </Form.Item>

        <Form.Item label="实名认证" style={{ height: 32 }}>
          <Form.Item name="realName" style={{ float: 'left', width: '145px' }}>
            <Input placeholder="请输入真实姓名" />
          </Form.Item>
          <Form.Item name="cardNum" style={{ float: 'left', marginLeft: 10, width: '300px' }}>
            <Input placeholder="请输入身份证号码" />
          </Form.Item>
        </Form.Item>

        <Form.Item name="country" label="国家">
          <Input placeholder="请输入国家" />
        </Form.Item>
        <Form.Item label="地区" style={{ height: 32 }}>
          <Form.Item name="province" style={{ float: 'left' }}>
            <Input style={{ width: '150px' }} placeholder="请输入省" />
          </Form.Item>
          <Form.Item name="city" style={{ float: 'left', marginLeft: 10 }}>
            <Input style={{ width: '150px' }} placeholder="请输入市" />
          </Form.Item>

          <Form.Item name="county" style={{ float: 'left', marginLeft: 10 }}>
            <Input style={{ width: '150px' }} placeholder="请输入县(区)" />
          </Form.Item>
        </Form.Item>

        <Form.Item name="address" label="详细地址">
          <Input placeholder="" />
        </Form.Item>

        <Form.Item name="level_Id" label="等级">
          <Input placeholder="" />
        </Form.Item>
        <Form.Item name="status" label="状态" rules={[{ required: true }]}>
          <Select placeholder="状态">
            <Option value={0}>启用</Option>
            <Option value={1}>停用</Option>
          </Select>
        </Form.Item>

        <Form.Item>
          <Button disabled={props.isLook} type="primary" htmlType="submit" style={{ float: 'right' }}>
            保存
          </Button>
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default CreateForm;
