diff --git a/src/Components/Reportes/RptMision.tsx b/src/Components/Reportes/RptMision.tsx new file mode 100644 index 0000000..bb5fc0c --- /dev/null +++ b/src/Components/Reportes/RptMision.tsx @@ -0,0 +1,382 @@ +import React, { FC, useEffect, useState } from 'react' +// Bootstrap components +import { Button, Card, Form } from 'react-bootstrap' +import { BsSearch, BsFileEarmarkExcel } from 'react-icons/bs' +// Interfaces +import IClientes from '../../Interfaces/Catalogos/IClientes' +import IArchivoElectronico from '../../Interfaces/IArchivoElectronico' +// DTOs +import DTOReporte from '../../DTO/DTOReporte' +// Services +import reportsDataService from '../../Services/Reportes/reportes.services' +import ClientesDataService from '../../Services/Catalogos/Clientes.Services' +// Redux +import { useDispatch } from 'react-redux' +import { setArchivoElectronico } from '../../store/features/Reportes/ArchivoElectronico' +// GUI components +import { MsgInformativo } from '../Utils/Toast/msgInformativo' +import { AgGridReact } from 'ag-grid-react' +import { RowClickedEvent } from 'ag-grid-community' +import { TargetURL } from '../../Constants/TargetURL' +//Other +import moment from 'moment' +import * as XLSX from 'xlsx' +import IRptMision from '../../Interfaces/Reportes/IRptMision' + +interface IProps {} + +const RptMision: FC = (props) => { + const [UserId, setUserId] = useState(() => { + const stickyValue = window.localStorage.getItem('UserId') + return stickyValue !== null ? JSON.parse(stickyValue) : 0 + }) + const [Data, setData] = useState>([]) + const [filteredData, setFilteredData] = useState>([]) + const [Inicio, setInicio] = useState(currentDate()) + const [Fin, setFin] = useState(currentDate()) + const [TipoOperacion, setTipoOperacion] = useState(1) + const [Cliente, setCliente] = useState(0) + const [Clientes, setClientes] = useState>() + const [msgColor, setMsgColor] = React.useState('primary') + const [show, setShowMsg] = useState(false) + const [header, setHeader] = useState('') + const [msg, setMsg] = useState('') + const [filtro, setFiltro] = useState('') + const gridRef = React.useRef(null) + const [columnaVerPDF, setcolumnaVerPDF] = useState(false) + const dispatch = useDispatch() + const [columnDefs] = useState([ + { + field: 'tipoOperacion', + headerName: 'TipoOperacion', + sortable: true, + filter: true + }, + { + field: 'sPedimento', + headerName: 'Pedimento', + sortable: true, + filter: true + }, + { field: 'sNumero', headerName: 'Numero', sortable: true, filter: true }, + { + field: 'dFechaFirmaBanco', + headerName: 'FechaFirmaBanco', + sortable: true, + filter: true + }, + { + field: 'sRazonSocial', + headerName: 'RazonSocial', + sortable: true, + filter: true + }, + { field: 'sRFC', headerName: 'RFC', sortable: true, filter: true }, + { + field: 'sReferencia', + headerName: 'Referencia', + sortable: true, + filter: true + }, + + { + field: 'sEDocument', + headerName: 'EDocument', + sortable: true, + filter: true + }, + { + field: 'sHRazonSocial', + headerName: 'SHRazonSocial', + sortable: true, + filter: true + }, + { + field: 'sHidentificadorProv', + headerName: 'HidentificadorProv', + sortable: true, + filter: true + }, + { + field: 'aa', + headerName: 'AA', + sortable: true, + filter: true + }, + { + field: 'rfcaa', + headerName: 'RFCAA', + sortable: true, + filter: true + }, + { + field: 'incoterm', + headerName: 'Incoterm', + sortable: true, + filter: true + }, + { + field: 'caja', + headerName: 'Caja', + sortable: true, + filter: true + }, + { + field: 'acuceDoda', + headerName: 'AcuceDoda', + sortable: true, + filter: true + }, + { + field: 'transportista', + headerName: 'Transportista', + sortable: true, + filter: true + } + ]) + + function currentDate(): string { + var today = new Date() + var dd = String(today.getDate()).padStart(2, '0') + var mm = String(today.getMonth() + 1).padStart(2, '0') //January is 0! + var yyyy = today.getFullYear() + return yyyy + '-' + mm + '-' + dd + } + + const closeToast = (show: boolean): void => { + setShowMsg(false) + } + + const generaReporte = () => { + if (Cliente === 0) { + setHeader('Error') + setMsg('Seleccion el cliente') + setShowMsg(true) + return + } + const data: DTOReporte = { + Inicio: moment(Inicio).format('YYYY-MM-DD'), + Fin: moment(Fin).format('YYYY-MM-DD'), + TipoOperacion: TipoOperacion, + NoCliente: Cliente, + IdUsuario: UserId + } + reportsDataService + .getRptMision(data) + .then((response) => { + setData(response.data) + setFilteredData(response.data) + setHeader('Informativo') + setMsg('Se encontro la siguiente informacion...') + setShowMsg(true) + }) + .catch((e: Error) => { + setHeader('Error') + setMsg('Ocurrio un error: ' + e) + setShowMsg(true) + return + }) + } + + useEffect(() => { + ClientesDataService.getAllClientes(parseInt(UserId)) + .then((response) => { + setClientes(response.data) + }) + .catch((e: Error) => { + setHeader('Error') + setMsg('Ocurrio un error: ' + e) + setShowMsg(true) + return + }) + }, []) + + const downloadExcel = () => { + exportExcel(Data, 'Mission') + } + + function exportExcel(jsonData: any[], fileName: string): void { + let Heading = [ + [ + 'TipoOperacion', + 'Pedimento', + 'Numero', + 'FechaFirmaBanco', + 'RazonSocial', + 'RFC', + 'Referencia', + 'EDocument', + 'HRazonSocial', + 'HidentificadorProv', + 'AA', + 'RFCAA', + 'Incoterm', + 'Caja', + 'AcuceDoda', + 'Transportista' + ] + ] + 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() + } + } + + const filtraReporte = (e: any) => { + setFiltro(e.target.value) + gridRef.current.api.setQuickFilter(e.target.value) + } + + async function getAE(e: any) { + if (e.column.colId === 'ver pedimento') { + setcolumnaVerPDF(true) + } else { + setcolumnaVerPDF(false) + } + } + + const formatNumber = (number: string, digits: number) => { + number = parseFloat(number).toFixed(digits) + let value = Number(number).toLocaleString('en') + if (!value.indexOf('NaN')) return '0.00' + return value + } + + return ( +
+ + +
+
+ setInicio(e.target.value)} + size="sm" + /> +
+
+ setFin(e.target.value)} + size="sm" + /> +
+
+ Tipo oper +
+
+ setTipoOperacion(parseInt(e.target.value))} + className="form-select form-select-sm" + > + + + +
+
+ Cliente +
+
+ { + setCliente(parseInt(e.target.value)) + }} + className="form-select form-select-sm" + > + + {Clientes + ? Clientes.map((c) => { + return c.agrupado === 1 ? ( + + ) : ( + '' + ) + }) + : null} + +
+
+ +
+
+
+
 
+
+ { + filtraReporte(e) + }} + /> +
+
+ +
+
+ + +
+
+ getAE(e)} + > +
+ +
+ ) +} +export default RptMision diff --git a/src/Interfaces/Reportes/IRptMision.ts b/src/Interfaces/Reportes/IRptMision.ts new file mode 100644 index 0000000..742f219 --- /dev/null +++ b/src/Interfaces/Reportes/IRptMision.ts @@ -0,0 +1,23 @@ +export default interface IRptMission { + +TipoOperacion : string, +sPedimento: string, +sNumero :string, +dFechaFirmaBanco : string, +sRazonSocial : string, +sRFC : string, +sRefrencia : string, +sEDocument : string, +sHRazonSocial : string, +sHidentificadorProv : string, +AA : string, +RFCAA : string, +Incoterm : string, +Caja : string, +AcuceDoda : string, +Transportista : string + +} + + + diff --git a/src/Services/Reportes/reportes.services.ts b/src/Services/Reportes/reportes.services.ts index 89ce4e9..54c4856 100644 --- a/src/Services/Reportes/reportes.services.ts +++ b/src/Services/Reportes/reportes.services.ts @@ -19,6 +19,7 @@ import { IRptMonitoreoFacturaPagadasAmazon } from '../../Interfaces/Reportes/I import DTORPTMonitorFacturasPagAmazon from '../../DTO/Utils/DTORPTMonitorFacturasPagAmazon' import { IRptFacturasFraccion } from '../../Interfaces/Reportes/IRptContsFacturasFraccion' import { data } from 'cypress/types/jquery' +import IRptMision from '../../Interfaces/Reportes/IRptMision' class reportsDataService { getRptPedimentosPagados(data: DTOReporte) { return http.post>( @@ -125,6 +126,12 @@ class reportsDataService { } + getRptMision(data: DTOReporte) { + return http.post>( + '/reportes/RptMission', data + ); + } + diff --git a/src/index.tsx b/src/index.tsx index 6cb3cf4..da5edfd 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -65,6 +65,7 @@ import RptConsultaTrafico from './Components/Clientes/Amazon/Reportes/ConsultaTr import RptMonitoreoFacturasPagadasAmazon from './Components/Reportes/RptMonitoreoFacturasPagadasAmazon' import CatFraccionesVulnerables from './Components/Catalogos/CatFraccionesVulnerables/CatFraccionesVulnerables' import RptFacturasFraccion from './Components/Reportes/RptContsFacturasFraccion' +import RptMision from './Components/Reportes/RptMision' require(`./css/${process.env.REACT_APP_ENVIRONMENT}-home.css`) @@ -211,6 +212,8 @@ ReactDOM.render( path="/RptPedimentosPagadosFacturasCruzadas" element={} /> + + } /> }