Se agregaron nuevas caracteristicas

src/components/administrador/reporte.tsx

@@ -57,6 +57,40 @@ export default function Reporte({ admin }: Props) {
     return (
         <div>
             <h4 className="mb-2">Descargar reporte</h4>
+            <Col>
+                <FormGroup>
+                <FormLabel>Seleccione una fecha de inicio:</FormLabel>
+                <InputGroup>
+                <DatePicker
+                    selected={selectedInicio}
+                    onChange={(date) => setSelectedInicio(date)}
+                    minDate={minDate}
+                    maxDate={maxDate}
+                    placeholderText="Seleccione una fecha de inicio"
+                    dateFormat="dd-MM-yyyy"
+                    className="form-control"
+                />
+                </InputGroup>
+                </FormGroup>
+            </Col>
+
+            <Col>
+                <FormGroup>
+                <FormLabel>Seleccione una fecha de fin:</FormLabel>
+                <InputGroup>
+                    <DatePicker
+                        selected={selectedFin}
+                        onChange={(date) => setSelectedFin(date)}
+                        minDate={minDate}
+                            maxDate={maxDate}
+                            placeholderText="Seleccione una fecha de fin"
+                            dateFormat="yyyy-MM-dd"
+                            className="form-control"
+                            />
+                        </InputGroup>
+                        </FormGroup>
+                    </Col>
+            {/* 
             <label htmlFor="fecha" className="text-sm font-medium">
                 Selecciona una fecha de inicio
             </label>
@@ -66,7 +100,12 @@ export default function Reporte({ admin }: Props) {
                 className="w-[280px] rounded-md border border-gray-300 p-2 text-sm focus:border-blue-500 focus:ring focus:ring-blue-200"
             />
             <p className="text-xs text-gray-500">fecha seleccionada: </p>
-            {/* 
+            
+            <label htmlFor="fecha" className="text-sm font-medium">Slecciona una fecha de fin</label>
+            <input type="date" id="fecha" className="w-[280px] rounded-md border border-gray-300 p-2 text-sm focus:border-blue-500 focus:ring focus:ring-blue-200"/>
+            <p className="ext-xs text-gray-500">fecha seleccionada: </p>
+
+
         <Col>
                         <FormGroup>
                         <FormLabel>Seleccione una fecha de inicio:</FormLabel>
@@ -102,7 +141,6 @@ export default function Reporte({ admin }: Props) {
                         </FormGroup>
                     </Col>
         */}
-
             <div>
                 <Button variant="info" onClick={descargar} disabled={validarFechas()}>
                 Descargar Excel