\r\n option.DESCRIPCION_CURSO + ' (' + option.NUMERO_SECCION + ')'}\r\n style={{ width: !movil ? '430px' : '100%' }}\r\n renderInput={(params) => \r\n {this.state.loadingSecciones ?
\r\n \r\n
\r\n \r\n \r\n \r\n\r\n \r\n );\r\n\r\n } \r\n \r\n })() \r\n } \r\n \r\n \r\n );\r\n }\r\nelse if (this.state.isLoggin === false)\r\n{\r\n //Auth.logout();\r\n window.location.reload();\r\n return; //(())\r\n}\r\nreturn null;\r\n\r\n}//FIN RENDER\r\n}\r\n\r\n)\r\n","import React from 'react';\r\n\r\n\r\n\r\nconst logos = [\r\n {\r\n name: \"Visa\",\r\n image: '/Multimedia/LogosTarjeta/Visa_Logo.png',\r\n width:53,\r\n height:16\r\n },\r\n {\r\n name: \"MasterCard\",\r\n image:'/Multimedia/LogosTarjeta/MasterCard_logo.png',\r\n width:51,\r\n height:38\r\n },\r\n {\r\n name: \"America Express\",\r\n image:'/Multimedia/LogosTarjeta/American_Express_logo.png',\r\n width:40,\r\n height:40\r\n },\r\n {\r\n name: \"Diners Club\",\r\n image:'/Multimedia/LogosTarjeta/Diners_Club_Logo.png',\r\n width:38,\r\n height:30\r\n },\r\n {\r\n name: \"JCB\",\r\n image:'/Multimedia/LogosTarjeta/JCB_Cards.png',\r\n width:38,\r\n height:30\r\n },\r\n {\r\n name: \"Verified Visa\",\r\n image:'/Multimedia/LogosTarjeta/verified-by-visa.png',\r\n width:70,\r\n height:32\r\n },\r\n {\r\n name: \"MasterCard SecureCode\",\r\n image:'/Multimedia/LogosTarjeta/mastercard-securecode.png',\r\n width:70,\r\n height:32\r\n },\r\n\r\n];\r\n\r\nfunction logosCards() {\r\n\r\n return(\r\n \r\n \r\n )\r\n} \r\n\r\n\r\n\r\nexport default withStyles(styles) ( \r\nclass App extends React.Component {\r\n\r\n//cuentaRef = React.createRef();\r\n//codigoCursoRef = React.createRef();\r\ntablaRef = React.createRef();\r\nvtRef = React.createRef();\r\nyearRef = React.createRef();\r\nmonthRef = React.createRef();\r\n constructor (props) {\r\n super(props);\r\n this.l=props.l\r\n this.e=props.e\r\n this.i=props.i\r\n this.cerrarVentana = props.cerrarventana\r\n this.response_code = props.response_code\r\n this.clearResponseCode = props.clearResponseCode\r\n this.state = {\r\n isLoggin : undefined,\r\n heightTableMain: 0,\r\n loadingMain: true,\r\n rows: [],\r\n openBackDrop: false,\r\n openBackDropInvisible: false,\r\n focus: '',\r\n \r\n //-------------------- PARAMETERS CREDOMATIC --------------------\r\n hash:'',\r\n time:'',\r\n total_pagar:0,//amount\r\n expiry: '', //ccexp\r\n type:'',\r\n orderid:0,\r\n key_id:'',\r\n number: '',//ccnumber\r\n redirect:'',\r\n cvc: '',\r\n name: '', //th\r\n avs:'',\r\n tax:0.00,\r\n //-----------------------------------------------------------------\r\n\r\n\r\n \r\n actualizarSaldo:false,\r\n bloqueoPago:false,\r\n msgbloqueoPago:'',\r\n open_dialog_pago:false,\r\n hiddenLP:true,\r\n disableBP:false\r\n \r\n\r\n\r\n \r\n };\r\n this.botones = [\r\n {icono: 'Add', toolt: 'Agregar curso', nombre: 'Agregar' ,escritura:true, onclick: this.addEvent, display: 'auto'},\r\n {icono: 'Edit', toolt: 'Modificar curso', nombre: 'Modificar' ,escritura:true, onclick: this.editEvent, display:'auto'},\r\n {icono: 'Delete', toolt: 'Eliminar curso', nombre: 'Eliminar' ,escritura:true, onclick: this.deleteEvent, color: colores.naranja, display: 'auto'}, \r\n ];\r\n this.botones_agregar = [];\r\n this.botones_eliminar = [];\r\n this.yearValue = null;\r\n this.monthValue = null;\r\n}\r\n\r\n\r\n\r\ncerrarmodal = () =>{\r\n \r\n this.consultaPagoPendiente()\r\n \r\n}\r\n\r\ncerrarmodal_pago=()=>event=>{\r\n this.setState({open_dialog_pago: false}) \r\n if(this.state.actualizarSaldo===false)\r\n {\r\n this.cerrarVentana();\r\n } \r\n}\r\n\r\n\r\nhandlePrintClick = (TRANSACTIONID)=>()=>{\r\n\r\n \r\n this.setState({ textbackdrop: \"Procesando...\",\r\n openBackDrop: true }, ()=>{\r\n \r\n new Request\r\n .get(`${globales.ip}/pagolinea/recibo/${tokenInfo.user}/${TRANSACTIONID}`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .retry(1)\r\n .timeout({ response: 60000, deadline: 60000, }) \r\n .end((err, res) => {\r\n \r\n if (err) { \r\n \r\n if (err.toString().substr(0,16) === 'Error: Forbidden')\r\n {\r\n \r\n window.location.reload();\r\n return;\r\n \r\n }\r\n \r\n this.setState({ openBackDrop: false }, ()=>{ \r\n funciones.showToast('e', 'No hay conexión');\r\n });\r\n \r\n return;\r\n }\r\n \r\n const rows = JSON.parse(res.text);\r\n \r\n let monto = 0;\r\n rows.map((item)=>{\r\n monto += item.MONTO_TOTAL; \r\n return item;\r\n });\r\n \r\n funciones.crearReciboPdf(this.state.orderid, \r\n funciones.getTime(rows[0].FECHA_PAGO), \r\n funciones.getTime(new Date(new Date()+\" UTC\").toISOString().slice(0, 10) + \" 00:00:00\", 0),\r\n rows[0].REFERENCIA1,\r\n rows[0].CUENTA_ALUMNO,\r\n rows[0].NOMBRE_COMPLETO,\r\n rows[0].DESCRIPCION_PLAN, \r\n rows,\r\n rows[0].Simbolo + funciones.formatCurrency(monto),\r\n rows[0].Simbolo + funciones.formatCurrency(monto), \r\n rows[0].Simbolo + \"0.00\", \r\n 'Pago en línea',\r\n movil, \r\n ()=>{}); \r\n \r\n });\r\n \r\n });\r\n \r\n }\r\n\r\ncomponentDidMount() { //Load\r\n \r\ntokenInfo = Auth.getProfile(); //Token decodificado\r\n\r\nthis.setState({ isLoggin: tokenInfo.plataforma !== undefined ? true : false }, ()=>{ \r\n\r\nthis.setState({ heightTableMain: funciones.getHeightTableMain(movil, this).heightTable }, ()=>{ \r\n \r\nthis.consultaPagoPendiente(2);\r\n\r\nthis.clearResponseCode();\r\n \r\n }); \r\n //console.log(funciones.getHeightTableMain(movil, this).heightTable)\r\n \r\n }); \r\n\r\n \r\n \r\n}\r\n\r\ncomponentWillUnmount() { //Cerrar Subcripciones\r\n //window.callMe = this.myFunc;\r\n \r\n}\r\n\r\nconsultaPagoPendiente = (tipoRegistroPrevioPagos) =>{\r\n \r\n Request\r\n .post(`${globales.ip}/pagolinea/consulta_saldo_pendiente`) \r\n .send({ \r\n CUENTA_ALUMNO:tokenInfo.user\r\n }) \r\n .retry(1)\r\n .timeout({ response: 60000, deadline: 60000, })\r\n .end((err, res) => {\r\n \r\n if (err) {\r\n \r\n if (err.toString().substr(0,16) === 'Error: Forbidden')\r\n { \r\n return; \r\n }\r\n \r\n (async function() {\r\n \r\n })();//FIN FUNCION ASYNC\r\n \r\n return;\r\n }\r\n \r\n const datos = JSON.parse(res.text);\r\n \r\n if (datos !== undefined) {\r\n\r\n if(datos.MSG<=0){ \r\n this.setState({total_pagar:0.00,open_dialog_pago:this.response_code==='100'?false:true,msgbloqueoPago:'No tiene saldo pendiente.'})\r\n \r\n }else{ \r\n this.setState({total_pagar:datos.MSG,orderid:datos.RESULT,actualizarSaldo:false})}\r\n \r\n if (datos.MONTO>=1)\r\n {\r\n this.registroPrevioPagos(datos.RESULT,tipoRegistroPrevioPagos)\r\n } \r\n }\r\n \r\n else //SI NO HAY REGISTROS\r\n {\r\n \r\n } \r\n \r\n });\r\n \r\n }\r\n\r\n registroPrevioPagos = (ID_FACTURA,TIPO) =>{\r\n \r\n Request\r\n .post(`${globales.ip}/pagolinea/registroPrevioPagos`) \r\n .send({ \r\n CUENTA_ALUMNO :tokenInfo.user,\r\n ID_FACTURA :ID_FACTURA,\r\n TIPO :TIPO\r\n }) \r\n .retry(1)\r\n .timeout({ response: 60000, deadline: 60000, })\r\n .end((err, res) => {\r\n \r\n if (err) {\r\n \r\n if (err.toString().substr(0,16) === 'Error: Forbidden')\r\n { \r\n return; \r\n }\r\n \r\n (async function() {\r\n \r\n })();//FIN FUNCION ASYNC\r\n \r\n return;\r\n }\r\n \r\n const datos = JSON.parse(res.text);\r\n \r\n if (datos !== undefined) { \r\n \r\n \r\n if(datos.RESP==='OK' && datos.RESULT>=1){\r\n \r\n if (localStorage.removeItem(\"HashPBV\")!=null)\r\n {\r\n localStorage.removeItem(\"HashPBV\");\r\n }\r\n \r\n this.setState({open_dialog_pago:true,msgbloqueoPago:datos.MSG,bloqueoPago:true})\r\n \r\n }else{ \r\n // this.setState({open_dialog_pago:false})\r\n \r\n }\r\n \r\n }\r\n \r\n else //SI NO HAY REGISTROS\r\n {\r\n \r\n } \r\n \r\n \r\n \r\n });\r\n \r\n }\r\n\r\n \r\n \r\nhandleOk = () => {\r\n //aqui\r\n\r\nif (this.state.name!==\"\" && this.state.cvc!==\"\" && this.state.number!==\"\" && this.state.expiry!==\"\")\r\n{\r\n\r\n let _this = this;\r\n\r\n this.setState({open_dialog_pago:true,msgbloqueoPago:\"Por favor, permanezca en esta página y espere a que finalice el proceso de pago.\",hiddenLP:false,disableBP:true,actualizarSaldo:false})\r\n\r\n setTimeout(function() {\r\n var time = unixTime(new Date()); \r\n\r\n Request\r\n .post(`${globales.ip}/pagolinea/paymentValidation`) \r\n .send({ \r\n orderid:_this.state.orderid,\r\n amount:_this.state.total_pagar,\r\n time: time,\r\n cuenta_alumno:tokenInfo.user\r\n }) \r\n .retry(1)\r\n .timeout({ response: 60000, deadline: 60000, })\r\n .end((err, res) => {\r\n \r\n if (err) {\r\n \r\n if (err.toString().substr(0,16) === 'Error: Forbidden')\r\n { \r\n // window.location.reload();\r\n return; \r\n }\r\n \r\n (async function() {\r\n // await _this.showToast('e', 'Error de conexión', 15000);\r\n })();//FIN FUNCION ASYNC\r\n \r\n return;\r\n }\r\n \r\n const datos = JSON.parse(res.text);\r\n \r\n if (datos !== undefined) //SI HAY REGISTROS\r\n { \r\n \r\n if (datos.hash!==null)\r\n { \r\n _this.setState({hash:datos.hash,time:time,key_id:datos.key_id, redirect:datos.redirect,type:datos.type}) \r\n localStorage.setItem(\"HashPBV\",datos.HashPBV); \r\n _this.registroPrevioPagos(_this.state.orderid,1)\r\n const frmBanKPayment = document.getElementById(\"frmBanKPayment\"); \r\n frmBanKPayment.submit();\r\n \r\n }\r\n \r\n else\r\n { \r\n _this.setState({actualizarSaldo:true,total_pagar:datos.monto,open_dialog_pago:true,msgbloqueoPago:datos.msg,hiddenLP:true,disableBP:false})\r\n } \r\n \r\n }\r\n \r\n });\r\n }, 3000);\r\n\r\n \r\n\r\n}\r\nelse //SI NO HAY REGISTROS\r\n{\r\n funciones.showToast('w', 'Complete los datos solicitados');\r\n} \r\n\r\n}\r\n\r\n\r\nhandleInputFocus = (e) => {\r\n\r\n let name =e.target.name\r\n if (name==='expiry2'){name='expiry'}\r\n this.setState({ focus: name });\r\n }\r\n \r\n handleInputChange = ({ target }) => {\r\n let { name, value } = target;\r\n\r\n \r\n if (name === 'number') {\r\n \r\n target.value = this.formatCreditCardNumber(value); \r\n\r\n } else if (name === 'expiry' || name=== 'expiry2' ) {\r\n name='expiry';\r\n\r\n value = this.formatExpirationDate(name,value);\r\n\r\n\r\n } else if (name === 'cvc') {\r\n \r\n \r\n } else if (name === 'name') {\r\n \r\n \r\n }\r\n\r\n \r\n this.setState({ [name]: value });\r\n };\r\n\r\n \r\n\r\n clearNumber(value = \"\") {\r\n return value.replace(/\\D+/g, \"\");\r\n }\r\n\r\n formatCreditCardNumber(value) {\r\n if (!value) {\r\n return value;\r\n }\r\n \r\n const clearValue = this.clearNumber(value);\r\n let nextValue;\r\n \r\n nextValue = `${clearValue.slice(0, 4)} ${clearValue.slice(\r\n 4,\r\n 8\r\n )} ${clearValue.slice(8, 12)} ${clearValue.slice(12, 19)}`;\r\n \r\n \r\n \r\n return nextValue.trim();\r\n }\r\n\r\n formatExpirationDate(name,value) {\r\n /* if (!value) {\r\n return value;\r\n } */\r\n this.monthValue='';\r\n this.yearValue='';\r\n\r\n this.monthValue = this.monthRef.current.value.length===0?'00'+this.monthRef.current.value: (this.monthRef.current.value.length===1?0+this.monthRef.current.value:this.monthRef.current.value);\r\n this.yearValue = this.yearRef.current.value.length ===0?'00':(this.yearRef.current.value.length===1?'0'+this.yearRef.current.value:(this.yearRef.current.value.length===2?this.yearRef.current.value:this.yearRef.current.value.slice(-2))); \r\n \r\n return this.monthValue+this.yearValue;\r\n }\r\n\r\n\r\nrender() {\r\nconst boton_cerrar_modal_pago =\r\n[\r\n {icono: 'Close', nombre: 'Cerrar' ,onclick: this.cerrarmodal_pago(), display:'auto'} \r\n]\r\nconst { classes } = this.props;\r\nconst botones_pagar =\r\n [\r\n { disabled:this.state.disableBP, icono: 'Check', toolt: 'Pagar', nombre: 'Pagar',escritura:true , onclick: (this.state.bloqueoPago===true || this.state.total_pagar<=0)?()=>{}:this.handleOk, display:'auto'}\r\n ]\r\n\r\n if (this.state.isLoggin === true)\r\n {\r\n return (\r\n \r\n \r\n \r\n \r\n {\r\n (() => {\r\n \r\n if ( tokenInfo.plataforma === 2 ) \r\n {\r\n \r\n return (\r\n \r\n \r\n \r\n \r\n \r\n );\r\n\r\n } \r\n \r\n })()\r\n\r\n }\r\n\r\n \r\n \r\n \r\n );\r\n }\r\nelse if (this.state.isLoggin === false)\r\n{\r\n //Auth.logout();\r\n window.location.reload();\r\n return; //(())\r\n}\r\nreturn null;\r\n\r\n}//FIN RENDER\r\n}\r\n\r\n)\r\n"],"sourceRoot":""}
\r\n
\r\n \r\n\r\n \r\n \r\n {\r\n logos.map(logo => (\r\n 
\r\n ))\r\n }\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default logosCards;","import React,{useEffect,useState,useRef} from 'react';\r\nimport {globales, colores, funciones } from '../../../../global';\r\nimport AuthService from '../../../../AuthService';\r\nimport Request from 'superagent';\r\nimport Paper from '@material-ui/core/Paper';\r\nimport BarraBotones from '../../../../components/Barra_menu';\r\nimport {withStyles} from '@material-ui/core/styles';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport TextField from '@material-ui/core/TextField';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport Typography from '@material-ui/core/Typography';\r\nimport Cards from 'react-credit-cards-2';\r\nimport 'react-credit-cards-2/dist/es/styles-compiled.css';\r\nimport Box from '@material-ui/core/Box';\r\nimport Button from '@material-ui/core/Button';\r\nimport Icono from '../../../../components/Icono';\r\nimport logosCards from './logosCards';\r\nimport IconButton from '@material-ui/core/IconButton';\r\nimport LinearProgress from '@material-ui/core/LinearProgress';\r\nimport CloseIcon from '@material-ui/icons/Close';\r\nvar unixTime = require('unix-time');\r\nlet Auth = new AuthService();\r\nlet tokenInfo = [];\r\n\r\nvar movil=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);\r\n//var movil_pequeño=/Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);\r\n\r\n \r\n\r\nconst styles = theme => ({\r\n\r\npaper: { \r\n borderRadius: globales.border_dialog,\r\n minWidth: !movil ? '405px' : undefined, \r\n maxWidth: !movil ? '405px' : undefined,\r\n minHeight: !movil ? '490px' : undefined, \r\n maxHeight: !movil ? '490px' : undefined\r\n }, \r\npaperConfirm: { \r\n borderRadius: globales.border_dialog,\r\n minWidth: '320px', \r\n maxWidth: '320px', \r\n},\r\n\r\ntextField: {\r\n width: !movil ?'335px':'100%',\r\n },\r\n\r\ntextField2: {\r\n width: !movil ?'100px':'29%',\r\n },\r\n\r\ntextField3: {\r\n width: !movil ?'100px':'29%',\r\n \"& input::-webkit-outer-spin-button, & input::-webkit-inner-spin-button\": {\r\n display: \"none\",\r\n }\r\n\r\n },\r\n\r\ncloseButton: {\r\n position: 'absolute',\r\n right: theme.spacing(1),\r\n top: theme.spacing(1),\r\n color: theme.palette.grey[500],\r\n},\r\n\r\nbackdrop: {\r\n zIndex: 500000,\r\n color: '#fff', \r\n flexDirection: 'column'\r\n},\r\n\r\nApp_payment: {\r\n padding: '30px',\r\n},\r\n\r\nform: {\r\n margin: '30px auto 0',\r\n maxWidth: '400px',\r\n },\r\n \r\n\r\n});\r\n//const widthTable = !movil ? window.screen.width - (globales.tabla.marginleft + globales.tabla.marginright) : 1336;\r\n\r\n\r\n const BotonesDialogPayment = (props) => {\r\n const {cerrarmodal,handlePrintClick}=props;\r\n\r\n const [hiddenBarra, setHiddenBarra] = useState(false)\r\n const [hiddenPrintl, setHiddenPrintl] = useState('none')\r\n const [TRANSACTIONID, setTRANSACTIONID] = useState('')\r\n const [rCode, setrCode] = useState(0)\r\n useEffect(()=>{\r\n \r\n window.fnBotonesDialogPayment = function (RESPONSE_CODE,TRANSACTIONID) {\r\n \r\n setHiddenBarra(true)\r\n if(RESPONSE_CODE==='100'){\r\n setrCode(10)\r\n setHiddenPrintl('inline') \r\n setTRANSACTIONID(TRANSACTIONID) \r\n }\r\n } \r\n })\r\n\r\n return(\r\n \r\n \r\n \r\n Procesando, por favor espere... \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n }\r\n style={{ display: hiddenPrintl, textTransform:'none' }} > \r\n Recibo\r\n \r\n\r\n
\r\n\r\n\r\n\r\n\r\n }\r\n style={{textTransform:'none'}}\r\n disabled={!hiddenBarra}\r\n \r\n >Cerrar \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n \r\n
\r\n\r\n \r\n \r\n \r\n {logosCards()}\r\n
\r\n \r\n{/*------------------------------------------DIALOG DE PAGO----------------------------------------------*/}\r\n\r\n\r\n\r\n\r\n {/*------------------------------------------DIV CONTENEDOR----------------------------------------------*/}\r\n\r\n