diff --git a/src/App.tsx b/src/App.tsx
index 0ae4480..324e2ab 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,5 @@
 import 'bootstrap/dist/css/bootstrap.min.css'
-import { BrowserRouter, Route, Routes } from 'react-router-dom'
+import { BrowserRouter, HashRouter, Route, Routes } from 'react-router-dom'
 import './App.css'
 import { Login } from './Components/Login/Login'
 import { Home } from './Components/Home/Home'
@@ -20,7 +20,9 @@ import { CatUsuarios } from './Components/Catalogos/CatUsuarios'
 import { ResetAccount } from './Components/ResetAccount/ResetAccount'
 
 function App() {
-  const UserLogued = useSelector((state: RootState) => state.UserProfile.UserProfile.logueado)
+  const UserLogued = useSelector(
+    (state: RootState) => state.UserProfile.UserProfile.logueado
+  )
 
   /*   useEffect(() => {
     console.log('Entro al proceso de router ' + UserLogued)
@@ -36,27 +38,27 @@ function App() {
 
   return (
     <div className='App'>
-      <BrowserRouter>
+      <HashRouter>
         <Navbar />
         <Routes>
           {/*   <Route path='/' element={<Home />}></Route>
           <Route path='login' element={<Login />}></Route> */}
           <Route path='/' element={<Login />}></Route>
-          <Route path='logout' element={<Logout />}></Route>
-          <Route path='reset' element={<ResetAccount />}></Route>
+          <Route path='/logout' element={<Logout />}></Route>
+          <Route path='/reset' element={<ResetAccount />}></Route>
           <Route element={<ProtectedRoute />}>
-            <Route path='OpMonitor' element={<OpMonitor />} />
-            <Route path='CatClientes' element={<CatClientes />} />
-            <Route path='CatServicios' element={<CatServicios />} />
-            <Route path='CatProveedores' element={<CatProveedores />} />
-            <Route path='CatTipoUnidades' element={<CatTipoUnidades />} />
-            <Route path='CatUbicaciones' element={<CatUbicaciones />} />
-            <Route path='CatRutas' element={<CatRutas />} />
-            <Route path='CatUsuarios' element={<CatUsuarios />} />
+            <Route path='/OpMonitor' element={<OpMonitor />} />
+            <Route path='/CatClientes' element={<CatClientes />} />
+            <Route path='/CatServicios' element={<CatServicios />} />
+            <Route path='/CatProveedores' element={<CatProveedores />} />
+            <Route path='/CatTipoUnidades' element={<CatTipoUnidades />} />
+            <Route path='/CatUbicaciones' element={<CatUbicaciones />} />
+            <Route path='/CatRutas' element={<CatRutas />} />
+            <Route path='/CatUsuarios' element={<CatUsuarios />} />
           </Route>
           <Route path='*' element={<PageNotFound />} />
         </Routes>
-      </BrowserRouter>
+      </HashRouter>
     </div>
   )
 }
diff --git a/src/Components/Catalogos/CatUsuarios.tsx b/src/Components/Catalogos/CatUsuarios.tsx
index bf72e59..8908a9f 100644
--- a/src/Components/Catalogos/CatUsuarios.tsx
+++ b/src/Components/Catalogos/CatUsuarios.tsx
@@ -1,5 +1,5 @@
 import React, { FC, useEffect, useState } from 'react'
-import { Button, Card, Col, FloatingLabel, Form, Row } from 'react-bootstrap'
+import { Button, Card, Col, FloatingLabel, Form, Modal, Row } from 'react-bootstrap'
 import { useSelector } from 'react-redux'
 import { RootState } from '../../store/store'
 import DSCatUsuarios from '../../Services/Catalogos/CatUsuarios.Services'
@@ -8,6 +8,7 @@ import DataTable from 'react-data-table-component'
 import { IconContext } from 'react-icons'
 import { BsFillPencilFill } from 'react-icons/bs'
 import Clean from '../../images/Clean.png'
+import loadingImg from '../../images/ajaxloader.gif'
 
 interface IProps {}
 
@@ -21,6 +22,7 @@ export const CatUsuarios: FC<IProps> = (props) => {
   const [TipoUsuario, setTipoUsuario] = useState(0)
   const [Search, setSearch] = useState('')
   const [SearchUser, setSearchUser] = useState('')
+  const [showDialog, setShowDialog] = useState(false)
   const columnsConcepts = [
     {
       name: 'id',
@@ -73,6 +75,7 @@ export const CatUsuarios: FC<IProps> = (props) => {
   }
 
   const saveForm = () => {
+    setShowDialog(true)
     const data: ICatUsuarios = {
       id: IDUsuario,
       usuario: Usuario,
@@ -86,6 +89,7 @@ export const CatUsuarios: FC<IProps> = (props) => {
       .then((response) => {
         cleanForm()
         loadUsers()
+        setShowDialog(false)
       })
       .catch((e: Error) => {
         alert('Ocurrio un error' + e.message.toString())
@@ -283,6 +287,22 @@ export const CatUsuarios: FC<IProps> = (props) => {
           </Row>
         </Card.Body>
       </Card>
+      <Modal
+        show={showDialog}
+        onHide={() => {
+          setShowDialog(false)
+        }}
+
+      >
+        <Modal.Header>
+          <Modal.Title></Modal.Title>
+        </Modal.Header>
+        <Modal.Body>
+          <img src={loadingImg} style={{ width: '25%', height: '25%' }} alt='proccessing' />
+        Generando acceso y enviando correo...
+        </Modal.Body>
+        <Modal.Footer></Modal.Footer>
+      </Modal>
     </div>
   )
 }
diff --git a/src/Components/Login/Login.tsx b/src/Components/Login/Login.tsx
index 16001d1..ab04a56 100644
--- a/src/Components/Login/Login.tsx
+++ b/src/Components/Login/Login.tsx
@@ -24,14 +24,20 @@ interface IProps {}
 export const Login: FC<IProps> = (props) => {
   const navigate = useNavigate()
   const dispatch = useDispatch()
-  const UserLogued = useSelector((state: RootState) => state.UserProfile.UserProfile.logueado)
+  const UserLogued = useSelector(
+    (state: RootState) => state.UserProfile.UserProfile.logueado
+  )
   const [Usuario, setUsuario] = useState('')
   const [Contrasena, setContrasena] = useState('')
   const [token, setToken] = useState<string>(
-    (window.localStorage.getItem('token') ? window.localStorage.getItem('token') : '')!
+    (window.localStorage.getItem('token')
+      ? window.localStorage.getItem('token')
+      : '')!
   )
   const [menuStr, setMenuStr] = useState<string>(
-    (window.localStorage.getItem('menu') ? window.localStorage.getItem('menu') : '')!
+    (window.localStorage.getItem('menu')
+      ? window.localStorage.getItem('menu')
+      : '')!
   )
 
   const Login = async () => {
@@ -44,10 +50,13 @@ export const Login: FC<IProps> = (props) => {
         localStorage.setItem('token', response.data.token)
         localStorage.setItem('menu', JSON.stringify(response.data.menu))
         setToken(response.data.token)
-        localStorage.setItem('tokenInfo', JSON.stringify(jwt_decode(response.data.token)))
+        localStorage.setItem(
+          'tokenInfo',
+          JSON.stringify(jwt_decode(response.data.token))
+        )
         dispatch(populateMenuItems(response.data.menu))
         dispatch(populateUserProfile(response.data.token))
-        navigate('/', { replace: true })
+        navigate('/#/', { replace: true })
       })
       .catch((e: Error) => {
         alert('Credeciales invalidas! ' + e.message.toString())
@@ -115,7 +124,9 @@ export const Login: FC<IProps> = (props) => {
               <img src={Leyend} alt='' height='50' />
             </h3>
             <div className='form-group mt-3'>
-              <label style={{ color: '#00719F', paddingLeft: '5px' }}>Usuario</label>
+              <label style={{ color: '#00719F', paddingLeft: '5px' }}>
+                Usuario
+              </label>
               <input
                 type='email'
                 className='form-control mt-1'
diff --git a/src/Components/Operaciones/OpMonitor.tsx b/src/Components/Operaciones/OpMonitor.tsx
index adb3a18..779adec 100644
--- a/src/Components/Operaciones/OpMonitor.tsx
+++ b/src/Components/Operaciones/OpMonitor.tsx
@@ -1,5 +1,16 @@
 import React, { FC, useEffect, useState } from 'react'
-import { Alert, Button, Card, Col, Form, Modal, OverlayTrigger, Row, Table, Tooltip } from 'react-bootstrap'
+import {
+  Alert,
+  Button,
+  Card,
+  Col,
+  Form,
+  Modal,
+  OverlayTrigger,
+  Row,
+  Table,
+  Tooltip,
+} from 'react-bootstrap'
 import { IconContext } from 'react-icons'
 import {
   BsChevronDown,
@@ -44,16 +55,18 @@ interface IProps {}
 
 export const OpMonitor: FC<IProps> = (props) => {
   const dispatch = useDispatch()
-  const navigate = useNavigate()
+  //  const navigate = useNavigate()
   const Info = JSON.parse(localStorage.getItem('tokenInfo') || '[]')
-  const UserID = Info.UserId
-  const CatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes)
+  /// const UserID = Info.UserId
+  /*   const CatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes)
   const CatProveedores = useSelector((state: RootState) => state.CatProveedores.CatProveedores)
   const CatTipoUnidades = useSelector((state: RootState) => state.CatTipoUnidades.CatTipoUnidades)
   const CatUbicaciones = useSelector((state: RootState) => state.CatUbicaciones.CatUbicaciones)
-  const CatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios)
+  const CatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios)*/
   const AllTrips = useSelector((state: RootState) => state.OpViajes.OpViajes)
-  const AllTripsServices = useSelector((state: RootState) => state.OpViajesServicios.OpViajesServicios)
+  const AllTripsServices = useSelector(
+    (state: RootState) => state.OpViajesServicios.OpViajesServicios
+  )
   const [OpViajes, setOpViajes] = useState<DTOOpViajes[]>([])
   const [showTripDialog, setShowTripDialog] = useState(false)
   const [ShowDeleteDialog, setShowDeleteDialog] = useState(false)
@@ -144,6 +157,10 @@ export const OpMonitor: FC<IProps> = (props) => {
     loadEveryting()
   }, [])
 
+  useEffect(() => {
+    console.log(JSON.stringify(AllTripsServices))
+  }, [AllTripsServices])
+
   const loadStatus = () => {
     DSOpStatusSecuence.GetStatusSecuence()
       .then((response) => {
@@ -152,6 +169,23 @@ export const OpMonitor: FC<IProps> = (props) => {
       .catch((e: Error) => {})
   }
 
+  const filterServices = (str: string, id: number) => {
+    if (!str) return false
+    const filtered = AllTripsServices.filter((obj) => obj.idViaje === id)
+    if (filtered) {
+    const filteredRows = filtered.filter(
+      (obj) =>
+        obj.sProveedor.toLowerCase().indexOf(str.toLowerCase()) > -1 ||
+        obj.sServicio.toLowerCase().indexOf(str.toLowerCase()) > -1 ||
+        obj.comentarios.toLowerCase().indexOf(str.toLowerCase()) > -1 ||
+        obj.noCaja.toLowerCase().indexOf(str.toLowerCase()) > -1
+    )
+    //console.log(JSON.stringify(filteredRows))
+    if (filteredRows.length) return true
+    else return false
+    } else return false
+  }
+
   const loadTrips = () => {
     DSOpViajes.Get()
       .then((response) => {
@@ -163,7 +197,7 @@ export const OpMonitor: FC<IProps> = (props) => {
         })
         setOpViajes(data)
         dispatch(populateOpViajes(data))
-        DSOpViajes.GetAllServices()
+        DSOpViajes.GetAllServices(99)
           .then((responsed) => {
             dispatch(populateOpViajesServicios(responsed.data))
           })
@@ -214,10 +248,16 @@ export const OpMonitor: FC<IProps> = (props) => {
                 style={{ cursor: 'pointer' }}
               >
                 <OverlayTrigger
-                  overlay={<Tooltip id='tooltip-disabled'>De un click aqui para iniciar un viaje</Tooltip>}
+                  overlay={
+                    <Tooltip id='tooltip-disabled'>
+                      De un click aqui para iniciar un viaje
+                    </Tooltip>
+                  }
                 >
                   <span className='d-inline-block'>
-                    <IconContext.Provider value={{ color: 'blue', size: '35px' }}>
+                    <IconContext.Provider
+                      value={{ color: 'blue', size: '35px' }}
+                    >
                       <FcInTransit />
                     </IconContext.Provider>
                   </span>
@@ -239,15 +279,13 @@ export const OpMonitor: FC<IProps> = (props) => {
           >
             <option value='0'>- Todos los usuarios -</option>
             {DataUsuarios
-              ? DataUsuarios.filter((row) => row.id > 1)
-                  /*  .sort((a, b) => a.nombre - b.nombre) */
-                  .map((row) => {
-                    return (
-                      <option key={row.id} value={row.id}>
-                        {row.nombre}
-                      </option>
-                    )
-                  })
+              ? DataUsuarios.filter((row) => row.id > 1).map((row) => {
+                  return (
+                    <option key={row.id} value={row.id}>
+                      {row.nombre}
+                    </option>
+                  )
+                })
               : null}
           </Form.Control>
         </Col>
@@ -292,86 +330,152 @@ export const OpMonitor: FC<IProps> = (props) => {
                 {AllTrips
                   ? AllTrips.filter(
                       (MasterData) =>
-                        (IDUsuario !== 0 ? MasterData.usuario === IDUsuario : 1 === 1) &&
-                        (MasterData.id.toString().toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.sCliente.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.sTipoOperacion.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.sOrigen.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.sDestino.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.sTipoUnidad.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.noCaja.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.refAgenciaAduanal.toLowerCase().includes(Search.toLowerCase()) ||
-                          MasterData.pickUpNumber.toLowerCase().includes(Search.toLowerCase()))
+                        ((IDUsuario !== 0
+                          ? MasterData.usuario === IDUsuario
+                          : 1 === 1) &&
+                          (MasterData.id
+                            .toString()
+                            .toLowerCase()
+                            .includes(Search.toLowerCase()) ||
+                            MasterData.sCliente
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.sTipoOperacion
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.sOrigen
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.sDestino
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.sTipoUnidad
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.noCaja
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.refAgenciaAduanal
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()) ||
+                            MasterData.pickUpNumber
+                              .toLowerCase()
+                              .includes(Search.toLowerCase()))) ||
+                        filterServices(Search.toLowerCase(), MasterData.id)
                     ).map((MasterData) => {
                       return (
                         <>
                           <tr
                             style={{ cursor: 'pointer' }}
-                            className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                            className={
+                              MasterData.max === true
+                                ? 'masterSelected'
+                                : 'normalSelected'
+                            }
                           >
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.id}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                               key={MasterData.id}
                               onClick={() => {
                                 changeToggle(MasterData)
                               }}
                             >
                               {MasterData.max === true ? (
-                                <IconContext.Provider value={{ color: 'blue', size: '15px' }}>
+                                <IconContext.Provider
+                                  value={{ color: 'blue', size: '15px' }}
+                                >
                                   <BsChevronDown />
                                 </IconContext.Provider>
                               ) : (
-                                <IconContext.Provider value={{ color: 'blue', size: '15px' }}>
+                                <IconContext.Provider
+                                  value={{ color: 'blue', size: '15px' }}
+                                >
                                   <BsChevronRight />
                                 </IconContext.Provider>
                               )}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.sCliente}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.sTipoOperacion}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.sOrigen}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.sDestino}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.sTipoUnidad}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.noCaja}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               <ViajeEstatus
                                 IDViaje={MasterData.id}
@@ -382,13 +486,21 @@ export const OpMonitor: FC<IProps> = (props) => {
                             </td>
                             <td
                               style={{ textAlign: 'center' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.hazmat === 1 ? 'Si' : 'No'}
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.refAgenciaAduanal}
                             </td>
@@ -399,17 +511,29 @@ export const OpMonitor: FC<IProps> = (props) => {
                                 setShowDocumentsDialog(true)
                               }}
                             >
-                              <IconContext.Provider value={{ color: 'green', size: '20px' }}>
+                              <IconContext.Provider
+                                value={{ color: 'green', size: '20px' }}
+                              >
                                 <BsPaperclip />
                               </IconContext.Provider>
                             </td>
                             <td
                               style={{ textAlign: 'left' }}
-                              className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
                             >
                               {MasterData.pickUpNumber}
                             </td>
-                            <td className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}>
+                            <td
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
+                            >
                               <Button
                                 size='sm'
                                 variant='white'
@@ -418,12 +542,20 @@ export const OpMonitor: FC<IProps> = (props) => {
                                   deleteMaster(MasterData)
                                 }}
                               >
-                                <IconContext.Provider value={{ color: 'red', size: '15px' }}>
+                                <IconContext.Provider
+                                  value={{ color: 'red', size: '15px' }}
+                                >
                                   <BsXLg />
                                 </IconContext.Provider>
                               </Button>
                             </td>
-                            <td className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}>
+                            <td
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected'
+                                  : 'normalSelected'
+                              }
+                            >
                               <Button
                                 size='sm'
                                 variant='white'
@@ -432,16 +564,30 @@ export const OpMonitor: FC<IProps> = (props) => {
                                   EditMaster(MasterData)
                                 }}
                               >
-                                <IconContext.Provider value={{ color: 'blue', size: '15px' }}>
+                                <IconContext.Provider
+                                  value={{ color: 'blue', size: '15px' }}
+                                >
                                   <BsFillPencilFill />
                                 </IconContext.Provider>
                               </Button>
                             </td>
                           </tr>
                           {MasterData.max === true ? (
-                            <tr className={MasterData.max === true ? 'masterSelected2' : 'normalSelected2'}>
-                              <th colSpan={2} style={{ backgroundColor: '#F8F9FE' }}></th>
-                              <th colSpan={14} style={{ backgroundColor: '#F8F9FE' }}>
+                            <tr
+                              className={
+                                MasterData.max === true
+                                  ? 'masterSelected2'
+                                  : 'normalSelected2'
+                              }
+                            >
+                              <th
+                                colSpan={2}
+                                style={{ backgroundColor: '#F8F9FE' }}
+                              ></th>
+                              <th
+                                colSpan={14}
+                                style={{ backgroundColor: '#F8F9FE' }}
+                              >
                                 <Servicios
                                   IDMaster={MasterData.id}
                                   key={MasterData.id}
@@ -495,7 +641,8 @@ export const OpMonitor: FC<IProps> = (props) => {
           <Row>
             <Col xs={12}>
               <Alert key='danger' variant='danger'>
-                Esta seguro de eliminar este viaje <span style={{ fontWeight: 'bold' }}>AOL: {IDViaje}</span>?
+                Esta seguro de eliminar este viaje{' '}
+                <span style={{ fontWeight: 'bold' }}>AOL: {IDViaje}</span>?
                 <br />
                 <span style={{ fontWeight: 'bold' }}>{SCliente}</span>
               </Alert>
diff --git a/src/Components/Utils/MFileManager/MFileManager.tsx b/src/Components/Utils/MFileManager/MFileManager.tsx
index 39e5425..7cd287b 100644
--- a/src/Components/Utils/MFileManager/MFileManager.tsx
+++ b/src/Components/Utils/MFileManager/MFileManager.tsx
@@ -96,7 +96,6 @@ export const MFileManager: FC<IProps> = (props) => {
       .then((response: any) => {
         if (response.status === 200) {
           if (row.nombreArchivo.toLowerCase().endsWith('.pdf')) {
-            // console.log(response.data)
             const blob = new Blob([response.data], { type: 'application/pdf' })
             const url = window.URL.createObjectURL(blob)
             window.open(url)
diff --git a/src/Services/Auth/config/http-common.ts b/src/Services/Auth/config/http-common.ts
index 2803379..48a6b82 100644
--- a/src/Services/Auth/config/http-common.ts
+++ b/src/Services/Auth/config/http-common.ts
@@ -1,45 +1,44 @@
-import axios from "axios";
+import axios from 'axios'
 import { TargetURL } from '../../../Constants/TargetURL'
-let token = window.localStorage.getItem('token');
+let token = window.localStorage.getItem('token')
 const URL = new TargetURL()
 
 const instance = axios.create({
   baseURL: URL.get(),
   headers: {
-    "Content-type": "application/json",
-    "Authorization": (token) ? `Bearer ${token}` : ''    
+    'Content-type': 'application/json',
+    Authorization: token ? `Bearer ${token}` : '',
   },
-});
-
-
-instance.interceptors.response.use(function (response) {
-  return response;
-}, function (error) {
-  if (401 === error.response.status) {
-    localStorage.clear();
-    window.location.href = "/";
-  } else {
-     return Promise.reject(error);
-  } 
-  return Promise.reject(error);
-});
+})
 
+instance.interceptors.response.use(
+  function (response) {
+    return response
+  },
+  function (error) {
+    if (401 === error.response.status) {
+      localStorage.clear()
+      window.location.href = '/#/login'
+    } else {
+      return Promise.reject(error)
+    }
+    return Promise.reject(error)
+  }
+)
 
 instance.interceptors.request.use(
   (config) => {
     let token = window.localStorage.getItem('token')
     if (token) {
-      config.headers!!.Authorization = `Bearer ${token}`;
+      config.headers!!.Authorization = `Bearer ${token}`
     } else {
-      config.headers!!.Authorization = ``;
+      config.headers!!.Authorization = ``
     }
-    return config;
+    return config
   },
   (error) => {
-    return Promise.reject(error);
+    return Promise.reject(error)
   }
-);
-
-
-export default instance;
+)
 
+export default instance
diff --git a/src/Services/Operaciones/OpViajes.Services.ts b/src/Services/Operaciones/OpViajes.Services.ts
index 85ce973..2075e87 100644
--- a/src/Services/Operaciones/OpViajes.Services.ts
+++ b/src/Services/Operaciones/OpViajes.Services.ts
@@ -1,39 +1,53 @@
-import http from "../../Services/Auth/config/http-common";
-import DTOViajes from "../../DTOs/Operaciones/DTOViajes";
-import IRespuesta from "../../Interfaces/Respuestas/IRespuesta";
-import DTOViajesServicios from "../../DTOs/Operaciones/DTOViajesServicios";
-import DTOUltimaCaja from "../../DTOs/Operaciones/DTOUltimaCaja";
-import DTOViajeEstatusSecuencia from "../../DTOs/Operaciones/DTOViajeEstatusSecuencia";
-import DTOChangeTripStatus from "../../DTOs/Operaciones/DTOChangeTripStatus";
-import DTOResultTripStatus from "../../DTOs/Operaciones/DTOResultTripStatus";
+import http from '../../Services/Auth/config/http-common'
+import DTOViajes from '../../DTOs/Operaciones/DTOViajes'
+import IRespuesta from '../../Interfaces/Respuestas/IRespuesta'
+import DTOViajesServicios from '../../DTOs/Operaciones/DTOViajesServicios'
+import DTOUltimaCaja from '../../DTOs/Operaciones/DTOUltimaCaja'
+import DTOViajeEstatusSecuencia from '../../DTOs/Operaciones/DTOViajeEstatusSecuencia'
+import DTOChangeTripStatus from '../../DTOs/Operaciones/DTOChangeTripStatus'
+import DTOResultTripStatus from '../../DTOs/Operaciones/DTOResultTripStatus'
 
 class OpViajesDataService {
   async Get() {
-    return await http.get<DTOViajes[]>("Operaciones/OpViajes/Get");
+    return await http.get<DTOViajes[]>('Operaciones/OpViajes/Get')
   }
-  async GetAllServices() {
-    return await http.get<DTOViajesServicios[]>("Operaciones/OpViajes/GetAllServices");
+  async GetAllServices(Status: number) {
+    return await http.get<DTOViajesServicios[]>(
+      `Operaciones/OpViajes/GetAllServices?Status=${Status}`
+    )
   }
   async GetLastTrailerBox(idViaje: number) {
-    return await http.get<DTOUltimaCaja>(`Operaciones/OpViajes/GetLastTrailerBox?idViaje=${idViaje}`);
+    return await http.get<DTOUltimaCaja>(
+      `Operaciones/OpViajes/GetLastTrailerBox?idViaje=${idViaje}`
+    )
   }
   async GetStatusSecuence() {
-    return await http.get<DTOViajeEstatusSecuencia[]>(`Operaciones/OpViajes/GetStatusSecuence`);
+    return await http.get<DTOViajeEstatusSecuencia[]>(
+      `Operaciones/OpViajes/GetStatusSecuence`
+    )
   }
   async ChangeTripStatus(data: DTOChangeTripStatus) {
-    return await http.put<DTOResultTripStatus>(`Operaciones/OpViajes/ChangeTripStatus/${data.idViaje}`, data);
+    return await http.put<DTOResultTripStatus>(
+      `Operaciones/OpViajes/ChangeTripStatus/${data.idViaje}`,
+      data
+    )
   }
   async Append(data: DTOViajes) {
-    return await http.post<DTOViajes>(`Operaciones/OpViajes/Append`,data);
+    return await http.post<DTOViajes>(`Operaciones/OpViajes/Append`, data)
   }
   async AppendServices(data: DTOViajesServicios) {
-    return await http.post<DTOViajesServicios[]>(`Operaciones/OpViajes/AppendService`,data);
+    return await http.post<DTOViajesServicios[]>(
+      `Operaciones/OpViajes/AppendService`,
+      data
+    )
   }
   async Delete(id: number) {
-    return await http.delete<IRespuesta>(`Operaciones/OpViajes/Delete/${id}`);
+    return await http.delete<IRespuesta>(`Operaciones/OpViajes/Delete/${id}`)
   }
   async DeleteService(id: number) {
-    return await http.delete<IRespuesta>(`Operaciones/OpViajes/DeleteService/${id}`);
+    return await http.delete<IRespuesta>(
+      `Operaciones/OpViajes/DeleteService/${id}`
+    )
   }
 }
-export default new OpViajesDataService();
\ No newline at end of file
+export default new OpViajesDataService()
diff --git a/src/images/ajaxloader.gif b/src/images/ajaxloader.gif
new file mode 100644
index 0000000..a011d56
Binary files /dev/null and b/src/images/ajaxloader.gif differ