import React, { useState, useEffect } from 'react';
import { notification, Form, Input } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { updateGroupName } from '@/services/RoleManage/api';
const { Item } = Form;
const EditGroup = props => {
  const { confirmModal, itemObj } = props;
  const [loading, setLoading] = useState(false);
  const [form] = Form.useForm();

  useEffect(() => {
    console.log(itemObj.groupflag, 'flag');
    form.setFieldsValue({
      newName: itemObj.groupflag,
    });
  }, [itemObj]);
  const onSubmit = props => {
    setLoading(true);
    console.log(itemObj)
    updateGroupName({
      subSystemValue: itemObj.visibleValue || itemObj.subSystemValue,
      oldName: itemObj.groupflag,
      newName: form.getFieldsValue().newName,
    })
      .then(res => {
        setLoading(false);
        if (res.code===0) {
          form.resetFields();
          notification.success({
            message: '提示',
            duration: 3,
            description: '修改成功',
          });
          confirmModal();
        } else {
          notification.error({
            message: '提示',
            duration: 15,
            description: res.msg,
          });
        }
      })
      .catch(err => {
        setLoading(false);
      });
  };

  return (
    <SiteModal
      {...props}
      title="编辑分组名称"
      bodyStyle={{ width: '100%', minHeight: '50px' }}
      style={{ top: 200 }}
      width="600px"
      destroyOnClose
      cancelText="取消"
      okText="确认"
      onOk={() => onSubmit()}
      confirmLoading={loading}
    >
      <Form form={form} wrapperCol={{ span: 20 }}>
        <Item label="分组名称" name="newName">
          <Input placeholder="请输入分组名称" />
        </Item>
      </Form>
    </SiteModal>
  );
};

export default EditGroup;