se agrego el componente catFraccionesVulnerables y sus archivos

FraccionesVulneFronted
Luis Rendon 1 year ago
parent 747f5a2f4a
commit 784f2ae26c
  1. 490
      src/Components/Catalogos/CatFraccionesVulnerables/CatFraccionesVulnerables.tsx
  2. 180
      src/Components/Reportes/RptPedimentosPagadosFacturasCruzadas.tsx
  3. 6
      src/Interfaces/Catalogos/ICatFraccionesVulnerables.ts
  4. 27
      src/Services/Catalogos/FraccionesVulnerables.ts
  5. 3
      src/index.tsx
  6. 42
      src/store/features/CatFraccionesVulnerables/CatFraccionesVulnerablesSlice.ts
  7. 3
      src/store/store.ts

@ -0,0 +1,490 @@
import React, { FC, useEffect, useState } from 'react'
import { Button, Card, Col, Form, Modal, Row } from 'react-bootstrap'
import { IconContext } from 'react-icons'
import ICatFraccionesVulnerables from '../../../Interfaces/Catalogos/ICatFraccionesVulnerables'
import FraccionesVulnerables from '../../../Services/Catalogos/FraccionesVulnerables'
import { useDispatch, useSelector } from 'react-redux'
// import { RootState } from '../../../store/store';
import { BsFileEarmarkExcel, BsFillPencilFill, BsSearch } from 'react-icons/bs'
import DataTable from 'react-data-table-component'
import * as XLSX from 'xlsx'
import { FaEraser } from 'react-icons/fa'
// import * as CurrencyFormat from 'react-currency-format';
// import { addCatFraccionesVulnerables, deleteCatFraccionesVulnerables } from '../../../store/features/CatFraccionesVulnerables/CatFraccionesVulnerablesSlice';
// import { MsgInformativo } from '../../Utils/Toast/msgInformativo';
// import { data } from 'cypress/types/jquery';
import { FormControl } from 'react-bootstrap'
import { AiFillCloseCircle } from 'react-icons/ai'
import { AiOutlineSave } from 'react-icons/ai'
// import { Console } from 'console';
// import { NewLineKind } from 'typescript';
// Define types for the component props and table row data
interface IProps {}
export default function CatFraccionesVulnerables(props: IProps) {
const [UserType, setUserType] = useState(() => {
const stickyValue = window.localStorage.getItem('UserType')
return stickyValue !== null ? JSON.parse(stickyValue) : ''
})
const dispatch = useDispatch()
const [Data, setData] = useState<ICatFraccionesVulnerables[]>([])
// const [filteredData, setFilteredData] = useState<ICatFraccionesVulnerables[]>([]);
// const [DoneColor, setDoneColor] = useState('#CCD1D1')
const [tipoReporte, setTipoReporte] = useState(0)
// const [filtro, setFiltro] = useState('')
const [DataOriginal, setDataOriginal] = useState<ICatFraccionesVulnerables[]>(
[]
)
// const mFraccionesVulnerables = useSelector((state: RootState) => state.CatFraccionesVulnerables.CatFraccionesVulnerables);
const [header, setHeader] = useState<string>('') // Specify the type of 'header'
// const [msgColor, setMsgColor] = useState<string>('primary'); // Specify the type of 'msgColor'
const [show, setShowMsg] = useState<boolean>(false) // Specify the type of 'show'
const [msg, setMsg] = useState<string>('') // Specify the type of 'msg'
// const [msgDialog, setMsgDialog] = useState<boolean>(false); // Specify the type of 'msgDialog'
const [id, setId] = useState<number>(0) // Specify the type of 'id'
const [Fraccion, setFraccion] = useState<number>(0) // Specify the type of 'Fraccion'
const [Nico, setNico] = useState<string>('') // Specify the type of 'Nico'
const [Activo, setActivo] = useState<number>(0) // Specify the type of 'Activo'
// const [CurrentTime2Number, setCurrentTime2Number] = useState(0)
const [showModal, setShowModal] = useState<boolean>(false)
const [editMode, setEditMode] = useState(false) // Nuevo estado para controlar el modo de edición
const [selectedRow, setSelectedRow] =
useState<ICatFraccionesVulnerables | null>(null) // Nuevo estado para almacenar la fila seleccionada
// const [fraccionesVulnerables, setFraccionesVulnerables] = useState([]);
const [modalFileManager, setModalFileManager] = useState(false)
// const [modalFileManagerCorresponsal, setModalFileManagerCorresponsal] =
// useState(false)
const columnsFraccionesVulnerables = [
{
name: 'Id',
width: '14%',
selector: (row: ICatFraccionesVulnerables) => row.id,
sortable: true
},
{
name: 'Fraccion',
width: '20%',
selector: (row: ICatFraccionesVulnerables) => row.fraccion,
sortable: true
},
{
name: 'Nico',
width: '15%',
selector: (row: ICatFraccionesVulnerables) => row.nico,
sortable: true
},
{
name: 'Activo',
width: '15%',
selector: (row: ICatFraccionesVulnerables) =>
row.activo === 1 ? 'Sí' : 'No',
sortable: true
},
{
name: 'Edita',
width: '15%',
cell: (row: ICatFraccionesVulnerables) => (
<Button
size="sm"
variant="light"
style={{
textAlign: 'right',
visibility: UserType === '4' ? 'hidden' : 'visible'
}}
onClick={() => loadRow(row)} // Cambia esta línea para pasar el objeto 'row' a la función 'loadRow'
>
<IconContext.Provider value={{ color: 'blue', size: '20px' }}>
<BsFillPencilFill />
</IconContext.Provider>{' '}
</Button>
)
},
{
name: 'Elimina',
width: '15%',
cell: (row: ICatFraccionesVulnerables) => (
<Button
size="sm"
variant="light"
style={{
textAlign: 'right',
visibility: UserType === '4' ? 'hidden' : 'visible'
}}
onClick={() => deleteRow(row.id)} // Llama a la función deleteRow pasando el ID de la fila
>
<IconContext.Provider value={{ color: 'red', size: '20px' }}>
<AiFillCloseCircle />
</IconContext.Provider>{' '}
</Button>
)
}
]
const loadRow = (data: ICatFraccionesVulnerables): void => {
setSelectedRow(data) // Al hacer clic en el botón de edición, establecemos la fila seleccionada en el estado
setEditMode(true) // Cambiamos a modo de edición
setId(data.id) // Establecemos el id de la fila seleccionada
setFraccion(data.fraccion) // Cargamos los valores de fracción y nico para edición
setNico(data.nico)
}
const generaReporte = () => {
setTipoReporte(0)
FraccionesVulnerables.getAll()
.then((response) => {
setData(response.data)
setDataOriginal(response.data)
// uploadAllRows(response.data)
})
.catch((e: Error) => {
setHeader('Error')
setMsg('Ocurrio un error: ' + e)
setShowMsg(true)
return
})
}
const uploadAllRows = (data: ICatFraccionesVulnerables[]) => {
// Iteramos sobre los datos y realizamos la petición para cada fila
data.forEach((row) => {
uploadFile(row)
})
}
useEffect(() => {
// console.log(id) // Esto imprimirá el valor actualizado de id después de que cambie
}, [id])
const handleCreateNewRecord = () => {
// console.log('se han borrod los texbox ')
setSelectedRow(null)
setFraccion(0)
setNico('')
setActivo(0) // Establecer a 0 (No)
setEditMode(true)
setId(0)
setShowModal(false)
}
function deleteRow(id: number): void {
FraccionesVulnerables.Delete(id)
.then((response) => {
// Una vez que obtengas la respuesta exitosa del servidor, puedes actualizar la tabla para reflejar el cambio.
// Podrías eliminar la fila directamente o marcarla como desactivada según tus necesidades.
// Por ejemplo, supongamos que en tu objeto ICatFraccionesVulnerables tienes una propiedad 'activo' que indica si la fila está activa o no.
// Podrías marcarla como desactivada al recibir la respuesta del servidor.
setData((prevData) =>
prevData.map((item) =>
item.id === id ? { ...item, activo: 0 } : item
)
)
console.log(response.data)
})
.catch((e: Error) => {
setHeader('Error')
setMsg('Ocurrió un error: ' + e)
return
})
}
const uploadFile = (data: ICatFraccionesVulnerables): Promise<any> => {
return new Promise((resolve, reject) => {
FraccionesVulnerables.Append(data)
.then((response) => {
// console.log(response.data) // Mensaje de éxito
resolve(response.data)
})
.catch((e: Error) => {
console.error('Error durante la inserción:', e) // Mensaje de error
reject(e)
})
})
}
const handleSaveChanges = async () => {
if (id === 0) {
if (Nico.length > 2) {
console.log(
'El valor de Nico tiene más de 2 caracteres. No se actualizará la tabla ni se realizará la petición uploadFile.'
)
return
}
const newRecord = {
id: id,
fraccion: Fraccion,
nico: Nico,
activo: Activo
}
try {
const response = await uploadFile(newRecord)
const newId = response.id // Asegúrate de usar el nombre correcto para el nuevo ID
// Actualizar el estado local con el nuevo registro que incluye el nuevo ID
const updatedRecord = { ...newRecord, id: newId }
setData((prevData) => [...prevData, updatedRecord])
// console.log('este el newId' + newId)
// console.log('este el id normal ' + id)
// Restablecer valores de los campos
setFraccion(0)
setNico('')
setActivo(1)
setEditMode(false)
setShowModal(false)
} catch (error) {
console.error('Error durante la inserción:', error)
}
} else {
// Aquí actualizamos el registro existente
if (Nico.length > 2) {
console.log(
'El valor de Nico tiene más de 2 caracteres. No se actualizará la tabla ni se realizará la petición uploadFile.'
)
return // Sale de la función sin hacer nada más
}
const updatedData = Data.map((row) =>
row.id === selectedRow?.id
? { ...row, fraccion: Fraccion, nico: Nico, activo: Activo }
: row
)
setData(updatedData)
const updatedRow = updatedData.find((row) => row.id === selectedRow?.id)
if (updatedRow) {
uploadFile(updatedRow) // Llamada a uploadFile para actualizar el registro
}
setEditMode(false)
setShowModal(false)
}
}
const downloadExcel = () => {
exportExcel(Data, 'Fracciones Vulnerables')
}
function exportExcel(
jsonData: ICatFraccionesVulnerables[],
fileName: string
): void {
let Heading = [['Id', 'Fraccion', 'Nico', 'Activo']]
const wb = XLSX.utils.book_new()
const ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet([])
XLSX.utils.sheet_add_aoa(ws, Heading)
XLSX.utils.sheet_add_json(ws, jsonData, { origin: 'A2', skipHeader: true })
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1')
XLSX.writeFile(wb, fileName + '.xlsx')
var range = XLSX.utils.decode_range(ws['!ref?'])
for (var C = range.s.c; C <= range.e.c; ++C) {
var address = XLSX.utils.encode_col(C) + '1' // <-- first row, column number C
if (!ws[address]) continue
ws[address].v = ws[address].v.toUpperCase()
}
}
// Función para manejar el cambio en el campo de entrada de la fracción
const handleFraccionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const value = parseFloat(e.target.value)
setFraccion(isNaN(value) ? 0 : value)
}
return (
<div className="mt-2">
<Card>
<Card.Body>
<div className="container">
<div
className="row mb-4 "
style={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
minHeight: '1vh'
}}
>
<Card
style={{
paddingTop: '10px',
paddingBottom: '5px',
width: '900px',
height: '50px'
}}
>
<Row>
<Col xs={12}></Col>
<Col xs={12}>
<Row className="align-items-center">
<Col xs={1}>
<Form.Label className="mb-0">Fracción</Form.Label>
</Col>
<Col xs={1}>
<FormControl
type="text"
value={Fraccion}
onChange={handleFraccionChange}
inputMode="numeric"
className="orm-select mx-2"
maxLength={8}
style={{
backgroundColor: 'white',
color: 'black',
padding: '4px',
width: '80px',
height: '30px'
}}
/>
</Col>
<Col
xs={1}
style={{ textAlign: 'right', width: '100px' }}
>
<Form.Label className="mb-0 ">Nico</Form.Label>
</Col>
<Col xs={1}>
<FormControl
type="text"
value={Nico}
onChange={(e) => setNico(e.target.value)}
className="orm-select mx-2"
maxLength={2}
style={{
backgroundColor: 'white',
color: 'black',
padding: '4px',
width: '30px',
height: '30px'
}}
/>
</Col>
<Col xs={2} style={{ textAlign: 'right', width: '50px' }}>
<Form.Label className="mb-0">Activo</Form.Label>
</Col>
<Col xs={2}>
<Form.Select
value={Activo}
onChange={(e) => setActivo(Number(e.target.value))}
className="form-select mx-2"
style={{
backgroundColor: 'white',
color: 'black',
padding: '4px',
width: '60px',
height: '30px'
}}
>
<option value={1}>Si</option>
<option value={0}>No</option>
</Form.Select>
</Col>
<Col xs={0} style={{ width: '100px' }}>
<Button
size="sm"
variant="light"
onClick={handleCreateNewRecord}
style={{
backgroundColor: 'orange',
color: 'white',
padding: '4px',
width: '50px',
height: '32px'
}}
>
<FaEraser />
</Button>
</Col>
<Col xs={0} style={{ width: '110px' }}>
<Button
style={{
backgroundColor: 'blue',
color: 'white',
padding: '2px',
width: '55px',
height: '30px'
}}
variant="primary"
size="sm"
onClick={() => {
generaReporte()
}}
>
<BsSearch />
</Button>
</Col>
<Col xs={0} style={{ width: '110px' }}>
<Button
style={{
backgroundColor: 'blue',
color: 'white',
padding: '0px',
width: '55px',
height: '30px'
}}
variant="primary"
onClick={handleSaveChanges}
>
<AiOutlineSave />
</Button>
</Col>
<Col xs={0} style={{ width: '110px' }}>
<Button
size="sm"
variant="success"
onClick={() => {
downloadExcel()
}}
style={{
backgroundColor: 'green',
color: 'white',
padding: '1px',
width: '55px',
height: '30px'
}}
>
<BsFileEarmarkExcel />
</Button>
</Col>
</Row>
</Col>
<Col xs={1}></Col>
</Row>
</Card>
</div>
<Row>
<Col xs={3}></Col>
<Col xs={6}>
<Card>
<DataTable
noHeader
defaultSortFieldId={'id'}
defaultSortAsc={true}
striped={true}
dense={true}
paginationPerPage={10}
pagination
highlightOnHover
columns={columnsFraccionesVulnerables}
data={Data}
pointerOnHover
/>
</Card>
</Col>
<Col xs={1}></Col>
</Row>
</div>
</Card.Body>
</Card>
</div>
)
}

@ -3,12 +3,12 @@ import React, { useEffect, useState } from 'react'
import { Button, Card, Form } from 'react-bootstrap' import { Button, Card, Form } from 'react-bootstrap'
import { BsCloudDownload, BsSearch, BsFileEarmarkExcel } from 'react-icons/bs' import { BsCloudDownload, BsSearch, BsFileEarmarkExcel } from 'react-icons/bs'
//interfaces //interfaces
import IClientes from "../../Interfaces/Catalogos/IClientes"; import IClientes from '../../Interfaces/Catalogos/IClientes'
import IArchivoElectronico from "../../Interfaces/IArchivoElectronico"; import IArchivoElectronico from '../../Interfaces/IArchivoElectronico'
import { IRptPedimentosPagadosFacturasCruzadas } from "../../Interfaces/Reportes/IRptPedimentosPagadosFacturasCruzadas"; import { IRptPedimentosPagadosFacturasCruzadas } from '../../Interfaces/Reportes/IRptPedimentosPagadosFacturasCruzadas'
//dtos //dtos
import DTOgetThesePedimentos from "../../DTO/DTOgetThesePedimentos"; import DTOgetThesePedimentos from '../../DTO/DTOgetThesePedimentos'
import DTOReporte from "../../DTO/DTOReporte"; import DTOReporte from '../../DTO/DTOReporte'
//Services //Services
import reportsDataService from '../../Services/Reportes/reportes.services' import reportsDataService from '../../Services/Reportes/reportes.services'
import ClientesDataService from '../../Services/Catalogos/Clientes.Services' import ClientesDataService from '../../Services/Catalogos/Clientes.Services'
@ -26,14 +26,18 @@ import moment from 'moment'
import * as XLSX from 'xlsx' import * as XLSX from 'xlsx'
const URL = new TargetURL() const URL = new TargetURL()
export default function RptPedimentosPagadosFacturasCruzadas(){ export default function RptPedimentosPagadosFacturasCruzadas() {
const [curURL, setCurURL] = useState(URL.get()) const [curURL, setCurURL] = useState(URL.get())
const [UserId, setUserId] = useState(() => { const [UserId, setUserId] = useState(() => {
const stickyValue = window.localStorage.getItem('UserId') const stickyValue = window.localStorage.getItem('UserId')
return stickyValue !== null ? JSON.parse(stickyValue) : 0 return stickyValue !== null ? JSON.parse(stickyValue) : 0
}) })
const [Data, setData] = useState<Array<IRptPedimentosPagadosFacturasCruzadas>>([]) const [Data, setData] = useState<
const [filteredData, setFilteredData] = useState<Array<IRptPedimentosPagadosFacturasCruzadas>>([]) Array<IRptPedimentosPagadosFacturasCruzadas>
>([])
const [filteredData, setFilteredData] = useState<
Array<IRptPedimentosPagadosFacturasCruzadas>
>([])
const [Inicio, setInicio] = useState(currentDate()) const [Inicio, setInicio] = useState(currentDate())
const [Fin, setFin] = useState(currentDate()) const [Fin, setFin] = useState(currentDate())
const [TipoOperacion, setTipoOperacion] = useState(1) const [TipoOperacion, setTipoOperacion] = useState(1)
@ -50,43 +54,40 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
const [columnDefs] = useState([ const [columnDefs] = useState([
{ field: 'referencia', sortable: true, filter: true }, { field: 'referencia', sortable: true, filter: true },
{ field: 'pedimento', sortable: true, filter: true { field: 'pedimento', sortable: true, filter: true },
},
{ field: 'clave', sortable: true, filter: true }, { field: 'clave', sortable: true, filter: true },
{ field: 'fechaFirmaBanco', sortable: true, filter: true }, { field: 'fechaFirmaBanco', sortable: true, filter: true },
{ field: 'tipoCambio', sortable: true, filter: true }, { field: 'tipoCambio', sortable: true, filter: true },
{ field: 'pesoBruto', sortable: true, filter: true }, { field: 'pesoBruto', sortable: true, filter: true },
{ field: 'paisVendedor', sortable: true, filter: true }, { field: 'paisVendedor', sortable: true, filter: true },
{ field: 'paisOrigen', sortable: true, filter: true }, { field: 'paisOrigen', sortable: true, filter: true },
{ field: 'numFacturas', sortable:true, filter: true }, { field: 'numFacturas', sortable: true, filter: true },
{ field: 'factura', sortable:true, filter: true }, { field: 'factura', sortable: true, filter: true },
{ field: 'valorFactura', sortable:true, filter: true }, { field: 'valorFactura', sortable: true, filter: true },
{ field: 'fraccion', sortable:true, filter: true }, { field: 'fraccion', sortable: true, filter: true },
{ field: 'descripcion', sortable:true, filter: true }, { field: 'descripcion', sortable: true, filter: true },
{ field: 'nClave', sortable:true, filter: true }, { field: 'nClave', sortable: true, filter: true },
{ field: 'cantFacturas', sortable:true, filter: true }, { field: 'cantFacturas', sortable: true, filter: true },
{ {
field: 'valorAduana', field: 'valorAduana',
sortable: true, sortable: true,
filter: true, filter: true,
cellRenderer: (params: any) => { cellRenderer: (params: any) => {
return params.value return params.value
}
}, },
}, { field: 'incrementables', sortable: true, filter: true },
{ field: 'incrementables', sortable:true, filter: true }, { field: 'adValorem', sortable: true, filter: true },
{ field: 'adValorem', sortable:true, filter: true }, { field: 'dta', sortable: true, filter: true },
{ field: 'dta', sortable:true, filter: true }, { field: 'iva', sortable: true, filter: true },
{ field: 'iva', sortable:true, filter: true }, { field: 'efectivo', sortable: true, filter: true },
{ field: 'efectivo', sortable:true, filter: true }, { field: 'total', sortable: true, filter: true },
{ field: 'total', sortable:true, filter: true }, { field: 'destino', sortable: true, filter: true },
{ field: 'destino', sortable:true, filter: true }, { field: 'cruce', sortable: true, filter: true },
{ field: 'cruce', sortable:true, filter: true }, { field: 'remite', sortable: true, filter: true },
{ field: 'remite', sortable:true, filter: true }, { field: 'caja', sortable: true, filter: true },
{ field: 'caja', sortable:true, filter: true }, { field: 'valorComercial', sortable: true, filter: true },
{ field: 'valorComercial', sortable:true, filter: true }, { field: 'incoterm', sortable: true, filter: true }
{ field: 'incoterm', sortable:true, filter: true },
]) ])
function currentDate(): string { function currentDate(): string {
@ -113,7 +114,7 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
Fin: moment(Fin).format('YYYY-MM-DD'), Fin: moment(Fin).format('YYYY-MM-DD'),
TipoOperacion: TipoOperacion, TipoOperacion: TipoOperacion,
NoCliente: Cliente, NoCliente: Cliente,
IdUsuario: UserId, IdUsuario: UserId
} }
reportsDataService reportsDataService
.getRptPedimentosPagadosFacturasCruzadas(data) .getRptPedimentosPagadosFacturasCruzadas(data)
@ -150,7 +151,10 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
exportExcel(Data, 'Pedimentos Pagados') exportExcel(Data, 'Pedimentos Pagados')
} }
function exportExcel(jsonData: IRptPedimentosPagadosFacturasCruzadas[], fileName: string): void { function exportExcel(
jsonData: IRptPedimentosPagadosFacturasCruzadas[],
fileName: string
): void {
let Heading = [ let Heading = [
[ [
'Referencia', 'Referencia',
@ -181,7 +185,7 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
'Caja', 'Caja',
'ValorComercial', 'ValorComercial',
'Inconterm' 'Inconterm'
], ]
] ]
/* jsonData.forEach(function (v) { /* jsonData.forEach(function (v) {
delete v.tipodeCambiodePedimento delete v.tipodeCambiodePedimento
@ -215,7 +219,7 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
PedimentoLargo: '', PedimentoLargo: '',
NoCliente: Cliente, NoCliente: Cliente,
IdUsuario: 0, IdUsuario: 0,
Archivo: '', Archivo: ''
} }
dispatch(setArchivoElectronico(data)) dispatch(setArchivoElectronico(data))
if (columnaVerPDF) { if (columnaVerPDF) {
@ -246,7 +250,7 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
NoCliente: Cliente, NoCliente: Cliente,
IdUsuario: UserId, IdUsuario: UserId,
TipoOperacion: TipoOperacion, TipoOperacion: TipoOperacion,
Pedimentos: Pedimentos, Pedimentos: Pedimentos
} }
AEOServices.getThesePDFs(data) AEOServices.getThesePDFs(data)
.then((response: any) => { .then((response: any) => {
@ -284,68 +288,72 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
<div> <div>
<Card> <Card>
<Card.Body> <Card.Body>
<div className='row'> <div className="row">
<div className='col-md-2'> <div className="col-md-2">
<Form.Control <Form.Control
defaultValue={Inicio} defaultValue={Inicio}
type='date' type="date"
name='Inicio' name="Inicio"
placeholder='Inicio' placeholder="Inicio"
title='Inicio' title="Inicio"
alt='Inicio' alt="Inicio"
data-date-format='YYYY-mm-dd' data-date-format="YYYY-mm-dd"
onChange={(e) => setInicio(e.target.value)} onChange={(e) => setInicio(e.target.value)}
size='sm' size="sm"
/> />
</div> </div>
<div className='col-md-2'> <div className="col-md-2">
<Form.Control <Form.Control
defaultValue={Fin} defaultValue={Fin}
type='date' type="date"
name='Fin' name="Fin"
placeholder='Fin' placeholder="Fin"
title='Fin' title="Fin"
alt='Fin' alt="Fin"
onChange={(e) => setFin(e.target.value)} onChange={(e) => setFin(e.target.value)}
size='sm' size="sm"
/> />
</div> </div>
<div className='col-md-1 right-label'> <div className="col-md-1 right-label">
<Form.Label size='sm'>Tipo oper</Form.Label> <Form.Label size="sm">Tipo oper</Form.Label>
</div> </div>
<div className='col-md-1'> <div className="col-md-1">
<Form.Control <Form.Control
as='select' as="select"
onChange={(e) => setTipoOperacion(parseInt(e.target.value))} onChange={(e) => setTipoOperacion(parseInt(e.target.value))}
className='form-select form-select-sm' className="form-select form-select-sm"
> >
<option value='1'>Importacion</option> <option value="1">Importacion</option>
<option value='2'>Exportacion</option> <option value="2">Exportacion</option>
</Form.Control> </Form.Control>
</div> </div>
<div className='col-md-1 right-label'> <div className="col-md-1 right-label">
<Form.Label size='sm'>Cliente</Form.Label> <Form.Label size="sm">Cliente</Form.Label>
</div> </div>
<div className='col-md-4'> <div className="col-md-4">
<Form.Control <Form.Control
as='select' as="select"
onChange={(e) => { onChange={(e) => {
setCliente(parseInt(e.target.value)) setCliente(parseInt(e.target.value))
}} }}
className='form-select form-select-sm' className="form-select form-select-sm"
> >
<option value='0'>-SELECCIONE-</option> <option value="0">-SELECCIONE-</option>
{Clientes {Clientes
? Clientes.map((c) => { ? Clientes.map((c) => {
return c.agrupado === 1 ? <option value={c.sClave}>{c.sRazonSocial}</option> : '' return c.agrupado === 1 ? (
<option value={c.sClave}>{c.sRazonSocial}</option>
) : (
''
)
}) })
: null} : null}
</Form.Control> </Form.Control>
</div> </div>
<div className='col-md-1 right-label'> <div className="col-md-1 right-label">
<Button <Button
variant='primary' variant="primary"
size='sm' size="sm"
onClick={() => { onClick={() => {
generaReporte() generaReporte()
}} }}
@ -355,37 +363,35 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
</Button> </Button>
</div> </div>
</div> </div>
<div className='row' style={{ paddingTop: 5 }}> <div className="row" style={{ paddingTop: 5 }}>
<div className='col'>&nbsp;</div> <div className="col">&nbsp;</div>
<div className='col-4'> <div className="col-4">
<Form.Control <Form.Control
type='text' type="text"
size='sm' size="sm"
placeholder='Search...' placeholder="Search..."
onChange={(e) => { onChange={(e) => {
filtraReporte(e) filtraReporte(e)
}} }}
/> />
</div> </div>
<div className='col'> <div className="col">
<Button <Button
size='sm' size="sm"
variant='success' variant="success"
onClick={() => { onClick={() => {
downloadExcel() downloadExcel()
}} }}
> >
<BsFileEarmarkExcel /> <BsFileEarmarkExcel />
&nbsp;Excel &nbsp;Excel
<BsCloudDownload />
&nbsp;PDF
</Button> </Button>
</div> </div>
</div> </div>
</Card.Body> </Card.Body>
</Card> </Card>
<br /> <br />
<div className='ag-theme-alpine' style={{ height: 500, width: '100%' }}> <div className="ag-theme-alpine" style={{ height: 500, width: '100%' }}>
{/* <button onClick={onButtonClick}>Get selected rows</button> */} {/* <button onClick={onButtonClick}>Get selected rows</button> */}
<AgGridReact <AgGridReact
rowData={filteredData} rowData={filteredData}
@ -399,7 +405,13 @@ export default function RptPedimentosPagadosFacturasCruzadas(){
onRowClicked={(e) => getParams(e)} onRowClicked={(e) => getParams(e)}
></AgGridReact> ></AgGridReact>
</div> </div>
<MsgInformativo show={show} msg={msg} header={header} msgColor={msgColor} closeToast={closeToast} /> <MsgInformativo
show={show}
msg={msg}
header={header}
msgColor={msgColor}
closeToast={closeToast}
/>
</div> </div>
) )
} }

@ -0,0 +1,6 @@
export default interface ICatFraccionesVulnerables{
id : number ,
fraccion : number,
nico : string,
activo : number
}

@ -0,0 +1,27 @@
import http from "../common/http-common";
import ICatFraccionesVulnerables from '../../Interfaces/Catalogos/ICatFraccionesVulnerables'
class FraccionesVulnerablesDataService {
constructor()
{
type returnData = [ICatFraccionesVulnerables[]]
}
getAll() {
return http.get<ICatFraccionesVulnerables[]>(`/Catalogos/CatFraccionesVulnerables/getAll`);
}
Append(data: ICatFraccionesVulnerables) {
return http.post<ICatFraccionesVulnerables>(`/Catalogos/CatFraccionesVulnerables/Append`, data);
}
Delete(id: number) {
return http.delete<ICatFraccionesVulnerables>(`/Catalogos/CatFraccionesVulnerables/Delete/${id}`);
}
}
export default new FraccionesVulnerablesDataService();

@ -13,6 +13,7 @@ import { Login } from './Components/Login/login'
import AmazonNoPartes from './Components/Clientes/Amazon/Reportes/AmazonNoPartes' import AmazonNoPartes from './Components/Clientes/Amazon/Reportes/AmazonNoPartes'
import AvisoCruce from './Components/AgenciaAduanal/AvisoCruce/AvisoCruce' import AvisoCruce from './Components/AgenciaAduanal/AvisoCruce/AvisoCruce'
import CatTabuladores from './Components/Catalogos/CatTabulador/CatTabulador' import CatTabuladores from './Components/Catalogos/CatTabulador/CatTabulador'
import DashboardCorresponsales from './Components/Dashboard/DashboardCorresponsales' import DashboardCorresponsales from './Components/Dashboard/DashboardCorresponsales'
import Dashboard from './Components/Dashboard/Dashboard' import Dashboard from './Components/Dashboard/Dashboard'
import DashboardDireccion from './Components/Dashboard/DashboardDireccion' import DashboardDireccion from './Components/Dashboard/DashboardDireccion'
@ -62,6 +63,7 @@ import RptPedimentosCruces06 from './Components/Reportes/Direccion/RptPedimentos
import RptSegregacion from './Components/Clientes/Amazon/Reportes/Segregacion/RptSegregacion' import RptSegregacion from './Components/Clientes/Amazon/Reportes/Segregacion/RptSegregacion'
import RptConsultaTrafico from './Components/Clientes/Amazon/Reportes/ConsultaTrafico/RptConsultaTrafico' import RptConsultaTrafico from './Components/Clientes/Amazon/Reportes/ConsultaTrafico/RptConsultaTrafico'
import RptMonitoreoFacturasPagadasAmazon from './Components/Reportes/RptMonitoreoFacturasPagadasAmazon' import RptMonitoreoFacturasPagadasAmazon from './Components/Reportes/RptMonitoreoFacturasPagadasAmazon'
import CatFraccionesVulnerables from './Components/Catalogos/CatFraccionesVulnerables/CatFraccionesVulnerables'
require(`./css/${process.env.REACT_APP_ENVIRONMENT}-home.css`) require(`./css/${process.env.REACT_APP_ENVIRONMENT}-home.css`)
@ -148,6 +150,7 @@ ReactDOM.render(
<Route path="/CatTabuladores" element={<CatTabuladores />} /> <Route path="/CatTabuladores" element={<CatTabuladores />} />
<Route path="/RptPedidos" element={<RptPedidos />} /> <Route path="/RptPedidos" element={<RptPedidos />} />
<Route path="/Rpt1868Facturas" element={<Rpt1868Facturas />} /> <Route path="/Rpt1868Facturas" element={<Rpt1868Facturas />} />
<Route path = "/CatFraccionesVulnerables" element={<CatFraccionesVulnerables /> } />
<Route <Route
path="/Rpt1868Transportista" path="/Rpt1868Transportista"
element={<Rpt1868Transportista />} element={<Rpt1868Transportista />}

@ -0,0 +1,42 @@
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import ICatFraccionesVulnerables from '../../../Interfaces/Catalogos/ICatFraccionesVulnerables';
const CatFraccionesVulnerables: ICatFraccionesVulnerables[] = [{id:0, fraccion:0 , nico:'' , activo:0 }]
const initialState = { CatFraccionesVulnerables }
export const CatFraccionesVulnerablesSlice = createSlice({
name: 'CatCorresponsales',
initialState: initialState,
reducers: {
populateCatFraccionesVulnerables : (state, action: PayloadAction<ICatFraccionesVulnerables[]>) => {
state.CatFraccionesVulnerables = []
state.CatFraccionesVulnerables.push(... action.payload)
},
addCatFraccionesVulnerables : (state, action: PayloadAction<ICatFraccionesVulnerables>) => {
var Existe = state.CatFraccionesVulnerables.find(function(item) {
return item.id === action.payload.id;
});
if (!Existe) state.CatFraccionesVulnerables.push(action.payload)
},
updateCatFraccionesVulnerables : (state, action: PayloadAction<ICatFraccionesVulnerables>) => {
const i = state.CatFraccionesVulnerables.findIndex(_element => _element.id === action.payload.id);
if (i > -1) state.CatFraccionesVulnerables[i] = action.payload;
else state.CatFraccionesVulnerables.push(action.payload);
},
deleteCatFraccionesVulnerables : (state, action: PayloadAction<number>) => {
const newArr = state.CatFraccionesVulnerables.filter(data => data.id != action.payload);
state.CatFraccionesVulnerables=newArr
},
InitCatFraccionesVulnerables : (state, action: PayloadAction<number>) => {
state.CatFraccionesVulnerables.splice(0,state.CatFraccionesVulnerables.length-1)
// state.CatCorresponsales = [{id:0, factura:'-Seleccione-', idTrafico:0, valorFacturaDls:0, proveedor:0}]
},
},
})
export const { addCatFraccionesVulnerables,
populateCatFraccionesVulnerables,
updateCatFraccionesVulnerables,
deleteCatFraccionesVulnerables,
InitCatFraccionesVulnerables } = CatFraccionesVulnerablesSlice.actions;
export default CatFraccionesVulnerablesSlice.reducer;

@ -3,6 +3,7 @@ import userStatusReducer from './features/userStatusSlice/userStatusSlice'
import ArchivoElectronicoSlice from './features/Reportes/ArchivoElectronico' import ArchivoElectronicoSlice from './features/Reportes/ArchivoElectronico'
import CatProveedoresSlice from './features/CatProveedores/CatProveedoresSlice' import CatProveedoresSlice from './features/CatProveedores/CatProveedoresSlice'
import CatCorresponsalesSlice from './features/CatCorresponsales/CatCorresponsalesSlice' import CatCorresponsalesSlice from './features/CatCorresponsales/CatCorresponsalesSlice'
import CatFraccionesVulnerablesSlice from './features/CatFraccionesVulnerables/CatFraccionesVulnerablesSlice'
import CorresponsalesFacturasSlice from './features/Corresponsales/CorresponsalesFacturasSlice' import CorresponsalesFacturasSlice from './features/Corresponsales/CorresponsalesFacturasSlice'
import CorresponsalesFacturasTercerosSlice from './features/Corresponsales/CorresponsalesFacturasTercerosSlice' import CorresponsalesFacturasTercerosSlice from './features/Corresponsales/CorresponsalesFacturasTercerosSlice'
import CorresponsalesContenedoresSlice from './features/Corresponsales/CorresponsalesContenedoresSlice' import CorresponsalesContenedoresSlice from './features/Corresponsales/CorresponsalesContenedoresSlice'
@ -19,12 +20,14 @@ import AmazonNoPartesSlice from './features/Clientes/2096/AmazonNoPartes'
import AmazonTraficoConsultaSlice from './features/Clientes/2096/AmazonTraficoConsulta' import AmazonTraficoConsultaSlice from './features/Clientes/2096/AmazonTraficoConsulta'
export const store = configureStore({ export const store = configureStore({
reducer: { reducer: {
userStatus: userStatusReducer, userStatus: userStatusReducer,
ArchivoElectronico: ArchivoElectronicoSlice, ArchivoElectronico: ArchivoElectronicoSlice,
CatProveedores: CatProveedoresSlice, CatProveedores: CatProveedoresSlice,
CatCorresponsales: CatCorresponsalesSlice, CatCorresponsales: CatCorresponsalesSlice,
CatFraccionesVulnerables : CatFraccionesVulnerablesSlice,
CFData: CorresponsalesFacturasSlice, CFData: CorresponsalesFacturasSlice,
CF3rosData: CorresponsalesFacturasTercerosSlice, CF3rosData: CorresponsalesFacturasTercerosSlice,
CCData : CorresponsalesContenedoresSlice, CCData : CorresponsalesContenedoresSlice,

Loading…
Cancel
Save