import React , { useState } from 'react'
import {BsChevronRight, BsChevronUp} from "react-icons/bs"
import {MdPermIdentity} from "react-icons/md"
import "./formulaireRdv.css"
import Navbar from "../../components/navbar";
import {BiMessage} from "react-icons/bi"
import DropFileInput from '../../components/uploadDoc/DropFileInput';
import { useDispatch} from "react-redux";

const FormulaireRdv = () => {
    const dispatch = useDispatch();

    const HandleChange = (e) => {
        setUser({ ...user, [e.target.name]: e.target.value });
      };
    
    const [user, setUser] = useState({
        firstName: "",
        lastName: "",
        
      });






  return (
    <div className="bodyContainer">
        <Navbar/>
        <div className='path'> Liste dentiste <BsChevronRight size={"15"} color={"#247285"}/> 
        Dr <BsChevronRight size={"15px"} color={"#247285"}/> 
         Prise de RDV <BsChevronRight size={"15px"} color={"#247285"}/> 
         Formulaire </div>
        <div className='formulaireBx'>
            <h2>Formulaire de la prise de rendez-vous</h2>
            <div class="container">
                <div class="row">
                    <div class="input-group mb-3 col">
                    <input
                        type="text"
                        name="firstName"
                        className="form-control"
                        placeholder="Nom et prénom"
                        aria-describedby="basic-addon2"
                        onChange={(e) => HandleChange(e)}
                        />
                        <span className="iconForm">
                        <MdPermIdentity size={"25px"} color={"grey"} />
                        </span>
                    </div>
                    <div class="input-group mb-3 col">
                    <select class="form-control" size="xl"name="motif" >
                            <option selected>Choose...</option>
                            <option >Choose...</option>
                    </select>
                    <span className="iconForm">
                        <BsChevronUp size={"25px"} color={"grey"} />
                        </span>
                    </div>
                    <div class="w-100"></div>
                    <div class="input-group mt-4 col">
                    <textarea class="input-group mb-3 col"  rows="3"size="200px" ></textarea>
                    <span className="iconForm">
                        <BiMessage size={"25px"} color={"grey"} />
                    </span>
                    </div>
                    <div class="input-group mt-4 col">
                        <div className='upload-container'>
                            <DropFileInput/>
                        </div>
                        
                    </div>
                </div>
            </div>
=
        </div>
        <div className='calenderBx'>

        </div>
    </div>
  )
}

export default FormulaireRdv