Se le agrega el control de los estatus del viaje

src/Components/Home/Home.tsx

@@ -35,6 +35,7 @@ export const Home: FC<IProps> = (props) => {
   const loadCatalogs = () => {
     DSCatClientes.Get()
       .then((response) => {
+        //     console.log(response.data)
         dispatch(populateCatClientes(response.data))
       })
       .catch((e: Error) => {})
@@ -58,12 +59,6 @@ export const Home: FC<IProps> = (props) => {
         dispatch(populateCatServicios(response.data))
       })
       .catch((e: Error) => {})
-
-    DSOpStatusSecuence.GetStatusSecuence()
-      .then((response) => {
-        dispatch(populateOpViajesEstatusSecuencia(response.data))
-      })
-      .catch((e: Error) => {})
   }
 
   const validateToken = () => {

src/Components/Operaciones/OpMonitor.tsx

@@ -7,6 +7,7 @@ import { useDispatch, useSelector } from 'react-redux'
 import { RootState } from '../../store/store'
 import DTOOpViajes from '../../DTOs/Operaciones/DTOViajes'
 import DSOpViajes from '../../Services/Operaciones/OpViajes.Services'
+import DSOpStatusSecuence from '../../Services/Operaciones/OpViajes.Services'
 import { Servicios } from './Viaje/Servicios/Servicios'
 import { populateOpViajes, updateOpViajes } from '../../store/features/Operaciones/OpViajesSlice'
 import { Viaje } from './Viaje/Viaje'
@@ -16,6 +17,7 @@ import {
   populateOpViajesServicios,
   updateOpViajesServicios,
 } from '../../store/features/Operaciones/OpViajesServiciosSlice'
+import { populateOpViajesEstatusSecuencia } from '../../store/features/Operaciones/OpViajes.Estatus.SecuenciaSlice'
 import { ViajeEstatus } from './Viaje/ViajeEstatus'
 
 interface IProps {}
@@ -81,9 +83,18 @@ export const OpMonitor: FC<IProps> = (props) => {
   }
 
   useEffect(() => {
+    loadStatus()
     loadTrips()
   }, [])
 
+  const loadStatus = () => {
+    DSOpStatusSecuence.GetStatusSecuence()
+      .then((response) => {
+        dispatch(populateOpViajesEstatusSecuencia(response.data))
+      })
+      .catch((e: Error) => {})
+  }
+
   const loadTrips = () => {
     DSOpViajes.Get()
       .then((response) => {
@@ -248,7 +259,12 @@ export const OpMonitor: FC<IProps> = (props) => {
                               style={{ textAlign: 'left' }}
                               className={MasterData.max === true ? 'masterSelected' : 'normalSelected'}
                             >
-                              <ViajeEstatus IDViaje={MasterData.id} TipoOperacion={MasterData.tipoOperacion} />
+                              <ViajeEstatus
+                                IDViaje={MasterData.id}
+                                sCliente={MasterData.sCliente}
+                                TipoOperacion={MasterData.tipoOperacion}
+                                Status={MasterData.status}
+                              />
                             </td>
                             <td
                               style={{ textAlign: 'center' }}

src/Components/Operaciones/Viaje/Viaje.tsx

@@ -196,6 +196,7 @@ export const Viaje: FC<IProps> = (props) => {
       tipoOperacion: TipoOperacion,
       pedimento: Pedimento,
       max: true,
+      status: 1,
     }
     DSOpViajes.Append(data)
       .then((response) => {

src/Components/Operaciones/Viaje/ViajeEstatus.tsx

@@ -1,34 +1,97 @@
-import React, { FC, useState } from 'react'
+import React, { FC, useEffect, useState } from 'react'
 import { Form } from 'react-bootstrap'
-import { useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 import { RootState } from '../../../store/store'
+import DSOpStatusSecuence from '../../../Services/Operaciones/OpViajes.Services'
+import { deleteOpViajes, updateOpViajes } from '../../../store/features/Operaciones/OpViajesSlice'
+import DTOChangeTripStatus from '../../../DTOs/Operaciones/DTOChangeTripStatus'
+import DTOOpViajes from '../../../DTOs/Operaciones/DTOViajes'
+import DTOViajeEstatusSecuencia from '../../../DTOs/Operaciones/DTOViajeEstatusSecuencia'
+import { setStatus } from '../../../store/features/Auth/UserProfileSlice'
+import { SignatureHelpTriggerReason } from 'typescript'
 
 interface IProps {
   IDViaje: number
+  sCliente: string
   TipoOperacion: number
+  Status: number
 }
 
 export const ViajeEstatus: FC<IProps> = (props) => {
+  const dispatch = useDispatch()
   const mTripStatus = useSelector((state: RootState) => state.OpViajesEstatusSecuencia.OpViajesEstatusSecuencia)
-  const [IDStatus, setIDStatus] = useState(0)
+  const AllTrips = useSelector((state: RootState) => state.OpViajes.OpViajes)
+  const [IDStatus, setIDStatus] = useState(props.Status)
+  const [ListaSecuencia, setListaSecuencia] = useState<DTOViajeEstatusSecuencia[]>([])
+  const [Secuencia, setSecuencia] = useState(1)
+
+  const changeStatus = (e: any) => {
+    setIDStatus(parseInt(e.target.value))
+  }
+
+  const enlistaSecuenciaViaje = () => {
+    const Lista: DTOViajeEstatusSecuencia[] = mTripStatus
+      .filter((row) => row.tipoOperacion === props.TipoOperacion && row.secuencia >= Secuencia)
+      .sort((a, b) => a.secuencia - b.secuencia)
+    setListaSecuencia(Lista)
+  }
+
+  useEffect(() => {
+    const filtraLista: DTOViajeEstatusSecuencia[] = mTripStatus
+      .filter((row) => row.estatus === props.Status)
+      .sort((a, b) => a.secuencia - b.secuencia)
+    setSecuencia(filtraLista[0] ? filtraLista[0].secuencia : 100)
+    enlistaSecuenciaViaje()
+  }, [])
+
+  useEffect(() => {
+    enlistaSecuenciaViaje()
+  }, [Secuencia, IDStatus])
+
+  const selectedStatus = () => {
+    const data: DTOChangeTripStatus = {
+      idViaje: props.IDViaje,
+      idEstatus: IDStatus,
+    }
+    DSOpStatusSecuence.ChangeTripStatus(data)
+      .then((response) => {
+        const Item: DTOViajeEstatusSecuencia[] = mTripStatus
+          .filter((row) => row.tipoOperacion === props.TipoOperacion && row.estatus === IDStatus)
+          .sort((a, b) => a.secuencia - b.secuencia)
+        alert('A cambiado el estatus del cliente: ' + props.sCliente + ' a : ' + Item[0].sEstatus)
+        let result = AllTrips.filter((a) => {
+          if (a.id == props.IDViaje) {
+            return a
+          }
+        })
+        const updatedRow: DTOOpViajes = { ...result[0] }
+        setSecuencia(response.data.secuencia)
+        updatedRow.status = response.data.secuencia
+        if (response.data.secuencia !== 100) {
+          updatedRow.status = response.data.secuencia
+          dispatch(updateOpViajes(updatedRow))
+        } else dispatch(deleteOpViajes(props.IDViaje))
+      })
+      .catch((e: Error) => {})
+  }
+
   return (
     <div>
       <Form.Control
         as='select'
         onChange={(e) => {
-          setIDStatus(parseInt(e.target.value))
+          changeStatus(e)
         }}
+        onKeyPress={(e) => e.key === 'Enter' && selectedStatus()}
         value={IDStatus}
         className='form-select form-select-sm dialogLabel'
       >
-        <option value='0'>Pendiente</option>
-        {mTripStatus
-          ? mTripStatus
-              .filter((row) => row.tipoOperacion === props.TipoOperacion)
+        {ListaSecuencia && Secuencia
+          ? ListaSecuencia.filter((row) => row.tipoOperacion === props.TipoOperacion && row.secuencia >= Secuencia)
               .sort((a, b) => a.secuencia - b.secuencia)
               .map((row) => {
                 return (
-                  <option key={row.id} value={row.id}>
+                  <option key={row.estatus} value={row.estatus}>
                     {row.sEstatus}
                   </option>
                 )

src/DTOs/Operaciones/DTOChangeTripStatus.ts

@@ -0,0 +1,4 @@
+export default interface DTOChangeTripStatus {
+  idViaje: number,
+  idEstatus: number
+}

src/DTOs/Operaciones/DTOResultTripStatus.ts

@@ -0,0 +1,4 @@
+export default interface DTOResultTripStatus {
+    idViaje: number,
+    secuencia: number
+}

src/DTOs/Operaciones/DTOViajes.ts

@@ -16,5 +16,6 @@ export default interface DTOOpViajes {
     sDestino: string,
     tipoOperacion: number,
     pedimento: string,
-    max: boolean
+    max: boolean,
+    status: number
 }

src/Services/Operaciones/OpViajes.Services.ts

@@ -4,31 +4,36 @@ 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 {
-  Get() {
-    return http.get<DTOViajes[]>("Operaciones/OpViajes/Get");
+  async Get() {
+    return await http.get<DTOViajes[]>("Operaciones/OpViajes/Get");
   }
-  GetAllServices() {
-    return http.get<DTOViajesServicios[]>("Operaciones/OpViajes/GetAllServices");
+  async GetAllServices() {
+    return await http.get<DTOViajesServicios[]>("Operaciones/OpViajes/GetAllServices");
   }
-  GetLastTrailerBox(idViaje: number) {
-    return http.get<DTOUltimaCaja>(`Operaciones/OpViajes/GetLastTrailerBox?idViaje=${idViaje}`);
+  async GetLastTrailerBox(idViaje: number) {
+    return await http.get<DTOUltimaCaja>(`Operaciones/OpViajes/GetLastTrailerBox?idViaje=${idViaje}`);
   }
-  GetStatusSecuence() {
-    return http.get<DTOViajeEstatusSecuencia[]>(`Operaciones/OpViajes/GetStatusSecuence`);
+  async GetStatusSecuence() {
+    return await http.get<DTOViajeEstatusSecuencia[]>(`Operaciones/OpViajes/GetStatusSecuence`);
   }
-  Append(data: DTOViajes) {
-    return http.post<DTOViajes>(`Operaciones/OpViajes/Append`,data);
+  async ChangeTripStatus(data: DTOChangeTripStatus) {
+    return await http.put<DTOResultTripStatus>(`Operaciones/OpViajes/ChangeTripStatus/${data.idViaje}`, data);
   }
-  AppendServices(data: DTOViajesServicios) {
-    return http.post<DTOViajesServicios[]>(`Operaciones/OpViajes/AppendService`,data);
+  async Append(data: DTOViajes) {
+    return await http.post<DTOViajes>(`Operaciones/OpViajes/Append`,data);
   }
-  Delete(id: number) {
-    return http.delete<IRespuesta>(`Operaciones/OpViajes/Delete/${id}`);
+  async AppendServices(data: DTOViajesServicios) {
+    return await http.post<DTOViajesServicios[]>(`Operaciones/OpViajes/AppendService`,data);
   }
-  DeleteService(id: number) {
-    return http.delete<IRespuesta>(`Operaciones/OpViajes/DeleteService/${id}`);
+  async Delete(id: number) {
+    return await http.delete<IRespuesta>(`Operaciones/OpViajes/Delete/${id}`);
+  }
+  async DeleteService(id: number) {
+    return await http.delete<IRespuesta>(`Operaciones/OpViajes/DeleteService/${id}`);
   }
 }
 export default new OpViajesDataService();