import { Form, Input } from 'antd';
import axios from 'axios';
import 'moment/locale/vi';
import React from 'react';
import { Button, Modal } from 'react-bootstrap';
import swal from 'sweetalert';
import { HOST } from '../../config/index';
import Store from '../../store';

const ModalPassword = (props) => {
    const { show, onHide, obj_id } = props;

    const [form] = Form.useForm()

    const click_handle = async () => {
        let dataPost = {password: form.getFieldValue('password')}
        console.log(dataPost, obj_id)
        const headers = {
            'Content-Type': 'application/json',
            'Authorization': Store.getState().isLogin.access_token,
        }
        const result = await axios.patch(`${HOST}/api/users/${obj_id}/password`,{headers} ,{ password: form.getFieldValue('password') })
        if (result.data.status === 10000) {
            swal({
                icon: 'success',
                title: 'Thành công',
                text: 'Thay đổi mật khẩu thành công',
                timer: 1500,
                buttons: false,
            })
            onHide()
        } else if (result.data.status === 10002) {
            swal("Thất bại", "Lỗi hệ thống!", "error");
        } else {
            swal("Thất bại", "Thay đổi mật khẩu thất bại!", "error");
        } 
    }


    return (
        <Modal
            {...props}
            animation={false}
            size="md"
            // keyboard={false}
            // dialogClassName={`${window.innerWidth >= 1920 ? "modal-size-res" : "modal-size"}`}
            aria-labelledby="contained-modal-title-vcenter"
        >
            <Modal.Header closeButton>
                <Modal.Title id="contained-modal-title-vcenter">Đổi mật khẩu
                </Modal.Title>
            </Modal.Header>

            <Modal.Body>
                <div id="formUpdateMeeting">
                    <div className="m-widget14 p-0">
                        <div className="row">
                            <div className="col-md-12 d-flex flex-column justify-content-between">
                                <Form
                                    id="formEdit"
                                    form={form}
                                    layout="vertical"
                                    onFinish={() => click_handle()}
                                    autoComplete="off"
                                    initialValues={{

                                    }}
                                >
                                    <Form.Item
                                        name="password"
                                        label="Mật khẩu mới"
                                        rules={[
                                            {
                                                required: true,
                                                message: '',
                                            },
                                        ]}
                                        hasFeedback
                                    >
                                        <Input.Password />
                                    </Form.Item>
                                 
                                    <Form.Item
                                        name="confirm"
                                        label="Xác nhận mật khẩu"
                                        dependencies={['password']}
                                        hasFeedback
                                        rules={[
                                            {
                                                required: true,
                                                message: '',
                                            },
                                            ({ getFieldValue }) => ({
                                                validator(_, value) {
                                                    if (!value || getFieldValue('password') === value) {
                                                        return Promise.resolve();
                                                    }
                                                    return Promise.reject(new Error('Mật khẩu không khớp'));
                                                },
                                            }),
                                        ]}
                                    >
                                        <Input.Password />
                                    </Form.Item>
                                </Form>
                            </div>
                        </div>
                    </div>
                </div>
            </Modal.Body>
            <Modal.Footer>
                <Button variant="accent" className={"m-loader--light m-loader--right "}
                    // disabled={loading} 
                    onClick={() => form.submit()}
                >Lưu</Button>
                <Button variant="secondary" onClick={onHide}>Đóng</Button>
            </Modal.Footer>
        </Modal>
    );
}

export default ModalPassword;