{option.CUENTA_ALUMNO}\r\n
{option.NOMBRE_COMPLETO}
\r\n \r\n);\r\n\r\nexport default withStyles(styles) (\r\nclass App extends React.Component {\r\n\r\ntablaRef = React.createRef();\r\ntablaListRef = React.createRef();\r\nactionModalRef = React.createRef();\r\nvtRef = React.createRef();\r\npuntosRef = React.createRef();\r\n\r\n constructor (props) {\r\n super(props);\r\n this.state = {\r\n isLoggin : undefined,\r\n heightTableMain: 0,\r\n rows: [],\r\n loadingCategorias: false,\r\n optionAutocomplete: [],\r\n valueAutoComplete: null,\r\n selectedDateInicio: new Date(),\r\n selectedDateFin: new Date(),\r\n loadingActividades: false,\r\n idRowSelected: null,\r\n openModalList: false,\r\n listTitle: '',\r\n heightTableList: 0,\r\n rowsList: [],\r\n loadingList: false,\r\n idRowSelectedList: null,\r\n openModalAdd: false,\r\n optionAutocompleteAdd: [],\r\n loadingClientes: true,\r\n saving: false,\r\n openAutoCompleteAdd: false,\r\n valueAutoCompleteAdd: null,\r\n checked: false,\r\n openModalConfirm: false,\r\n actionModal: 0,\r\n openBackDrop: false, \r\n };\r\n this.botones_Add =[\r\n {icono: 'Check', toolt: '', nombre: 'Agregar' ,onclick: this.handleAdd, display:'auto'},\r\n {icono: 'Close', toolt: '', nombre: 'Cerrar' ,onclick: this.handleCloseAdd, display:'auto', color: 'red'},\r\n ];\r\n this.botones_actualizar =[\r\n {icono: 'Check', toolt: '', nombre: 'Aceptar', onclick: this.handleOkConfirm, display:'auto'},\r\n {icono: 'Close', toolt: '', nombre: 'Cerrar' ,onclick: this.handleCloseConfirm, display:'auto', color: 'red'},\r\n ];\r\n this.botones_eliminar =[\r\n {icono: 'Check', toolt: '', nombre: 'Aceptar', onclick: this.handleOkConfirm, display:'auto'},\r\n {icono: 'Close', toolt: '', nombre: 'Cerrar' ,onclick: this.handleCloseConfirm, display:'auto', color: 'red'},\r\n ];\r\n this.changeYear = false;\r\n}\r\n\r\nobtenerCategorias = ()=>{\r\n\r\n this.setState({ loadingCategorias: true }, ()=>{\r\n\r\n new Request\r\n .get(`${globales.ip}/control_actividades_coprogramaticas/categorias`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .retry(1)\r\n .timeout({ response: 15000, deadline: 30000, }) \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({ loadingCategorias: 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 this.setState({ optionAutocomplete: rows, loadingCategorias: false });\r\n this.filtersClientes('-');\r\n\r\n });\r\n\r\n\r\n });\r\n\r\n\r\n}\r\n\r\nonChangeAutocomplete = (event, newValue) => {\r\n\r\nthis.setState({ valueAutoComplete: newValue }, ()=>{\r\n this.obtenerActividades();\r\n});\r\n\r\n}\r\n\r\nhandleDateChangeInicio = async (date)=>{\r\n \r\nconst newDate = this.changeYear ? this.state.selectedDateInicio : date;\r\n\r\nawait Promise.resolve(this.setState({ selectedDateInicio: newDate }));\r\nif (!this.changeYear){\r\nthis.obtenerActividades();\r\n}\r\n\r\nthis.changeYear = false;\r\n\r\n}\r\n\r\nhandleDateChangeFin = async (date)=>{\r\n\r\nconst newDate = this.changeYear ? this.state.selectedDateFin : date;\r\n\r\nawait Promise.resolve(this.setState({ selectedDateFin: newDate })); \r\nif (!this.changeYear){\r\n this.obtenerActividades();\r\n}\r\n \r\nthis.changeYear = false;\r\n \r\n}\r\n\r\nobtenerActividades = ()=>{\r\n\r\nif (this.state.valueAutoComplete === null)\r\n{ \r\n this.setState({ rows: [] });\r\n return;\r\n}\r\n\r\nlet validationDate = false;\r\n\r\nif (new Date(this.state.selectedDateInicio) > new Date(this.state.selectedDateFin))\r\n{\r\n validationDate = true;\r\n}\r\n\r\nlet fechaInicio = funciones.getDateSelect(this.state.selectedDateInicio); \r\nlet fechaFin = !validationDate ? funciones.getDateSelect(this.state.selectedDateFin) : fechaInicio; \r\n\r\nthis.setState({ selectedDateFin: !validationDate ? this.state.selectedDateFin : this.state.selectedDateInicio, loadingActividades: true }, ()=>{\r\n\r\nnew Request\r\n.get(`${globales.ip}/control_actividades_coprogramaticas/${this.state.valueAutoComplete.ID_CATEGORIA}/${fechaInicio}/${fechaFin}`)\r\n.set({'authorization': 'Bearer ' + Auth.getToken() })\r\n.retry(1)\r\n.timeout({ response: 15000, deadline: 30000, }) \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({ rows: [], loadingActividades: 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 this.setState({ rows: rows, loadingActividades: false });\r\n \r\n \r\n });\r\n\r\n\r\n});\r\n\r\n\r\n}\r\n\r\nhandleRowClick = (idRow) => event => {\r\n this.setState({ idRowSelected: idRow }); \r\n}\r\n\r\nhandleClick = ()=>{\r\n \r\nconst inforRowSelected = this.state.rows.find(x => x.ID_ACTIVIDADES_X_AREA === this.state.idRowSelected);\r\n\r\nthis.setState({ loadingList: true,\r\n listTitle: funciones.splitWords(5, 5, inforRowSelected.DESCRIPCION_ACTIVIDAD), \r\n rowsList: [], \r\n openModalList: true });\r\n\r\n\r\n\r\n}\r\n\r\nhandleCloseList = ()=>{\r\n this.setState({ openModalList: false });\r\n window.removeEventListener('resize', this.onResize);\r\n}\r\n\r\nonEntering = ()=>{\r\n\r\nthis.setState({ heightTableList: funciones.getHeightTableDialog(movil, this.tablaListRef, this.actionModalRef, !movil ? 7 : 5) }, ()=>{\r\n\r\n new Request\r\n .get(`${globales.ip}/control_actividades_coprogramaticas/alumnos/${this.state.idRowSelected}`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .retry(1)\r\n .timeout({ response: 15000, deadline: 30000, }) \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({ rowsList: [], loadingList: 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 this.setState({ rowsList: rows, loadingList: false }); \r\n \r\n });\r\n\r\n});\r\n\r\nif (movil)\r\n window.addEventListener(\"resize\", this.onResize); \r\n\r\n}\r\n\r\nhandleClickAddList = ()=>{\r\n\r\nthis.setState({ valueAutoCompleteAdd: null, \r\n checked: false, \r\n openModalAdd: true });\r\n\r\n}\r\n\r\nhandleRowListClick = (idRow) => event =>{\r\n this.setState({ idRowSelectedList: idRow });\r\n}\r\n\r\nhandleCloseAdd = ()=>{\r\n\r\nthis.setState({ openModalAdd: false });\r\n\r\n}\r\n\r\nonEnteringAdd = ()=>{\r\n\r\nthis.puntosRef.current.value = this.state.valueAutoComplete.PUNTAJE;\r\nif (!movil)\r\ndocument.getElementById('combo-box-ctl').focus();\r\n\r\n}\r\n\r\nonChangeInput = (e, value)=>{ \r\n\r\n if (e === null || e.target.value === undefined)\r\n {\r\n if (this.state.openAutoCompleteAdd) \r\n this.setState({ openAutoCompleteAdd: false });\r\n \r\n return;\r\n }\r\n \r\n if ((e.target.value.toString().trim().length < 3 || (this.state.valueAutoCompleteAdd !== null && value === this.state.valueAutoCompleteAdd.CUENTA_ALUMNO + ' | ' + this.state.valueAutoCompleteAdd.NOMBRE_COMPLETO)) && this.state.openAutoCompleteAdd)\r\n this.setState({ openAutoCompleteAdd: false });\r\n else if (e.target.value.toString().trim().length >= 3 && !this.state.openAutoCompleteAdd)\r\n this.setState({ openAutoCompleteAdd: true });\r\n\r\n}\r\n\r\nonBlurAutoCompleteAdd = ()=>{\r\n\r\nif (this.state.openAutoCompleteAdd)\r\n this.setState({ openAutoCompleteAdd: false }); \r\n\r\n}\r\n\r\nfiltersClientes = (value)=>{ \r\n\r\nnew Request\r\n .get(`${globales.ip}/control_actividades_coprogramaticas/estudiantes/${value}`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .retry(0)\r\n .timeout({ response: 20000, deadline: 30000, }) \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 this.setState({ optionAutocompleteAdd: [], openAutoCompleteAdd: false, loadingClientes: 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 this.setState({ optionAutocompleteAdd: rows, loadingClientes: false }); \t\r\n \r\n});\r\n \r\n}\r\n\r\nonChangeAutocompleteAdd = (event, value) =>{\r\n\r\n this.setState({ valueAutoCompleteAdd: value, openAutoCompleteAdd: false }, ()=>{\r\n\r\n this.setState({ checked: false }); \r\n \r\n });\r\n \r\n\r\n}\r\n\r\nhandleAdd = ()=>{\r\n \r\nif (!this.state.checked || funciones.isEmpty(this.state.valueAutoCompleteAdd))\r\n{\r\n funciones.showToast('w', 'Seleccione un estudiante y confirme previo a registrar')\r\n return;\r\n}\r\n\r\nif (parseInt(this.puntosRef.current.value.trim()) > parseInt(this.state.valueAutoComplete.PUNTAJE) || isNaN(parseInt(this.puntosRef.current.value.trim())) || parseInt(this.puntosRef.current.value.trim()) === 0 )\r\n{\r\n funciones.showToast('w', 'La cantidad de puntos no es válida');\r\n this.puntosRef.current.focus();\r\n return;\r\n}\r\n \r\nthis.setState({ saving: true }, ()=>{\r\n\r\n const cuenta_alumno = this.state.valueAutoCompleteAdd.CUENTA_ALUMNO;\r\n const puntos = parseInt(this.puntosRef.current.value.trim());\r\n const id_actividad = this.state.idRowSelected; \r\n\r\n new Request\r\n .post(`${globales.ip}/control_actividades_coprogramaticas/alumno/operaciones`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .set('Content-Type', 'application/json')\r\n .send({ tipo_proceso: 1, \r\n cuenta_alumno, \r\n puntos, \r\n id_actividad, \r\n id_asistencia_alumno: 0, \r\n ad_usuario: tokenInfo.user })\r\n .retry(0)\r\n .timeout({ response: 15000, 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({ saving: 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 if (rows.length > 0)\r\n { \r\n if (rows[0].RESP === 'OK')\r\n { \r\n\r\n let currentRows = this.state.rowsList.filter(x => x.CUENTA_ALUMNO !== cuenta_alumno);\r\n let newRow = [{ \r\n CUENTA_ALUMNO: cuenta_alumno,\r\n NOMBRE_COMPLETO: this.state.valueAutoCompleteAdd.NOMBRE_COMPLETO,\r\n HORA_ENTRADA: rows[0].HORA_ENTRADA,\r\n HORA_SALIDA: null,\r\n ID_ASISTENCIA_ALUMNO: rows[0].ID_ASISTENCIA_ALUMNO,\r\n DESCRIPCION_PLAN: rows[0].DESCRIPCION_PLAN, \r\n }];\r\n\r\n this.setState({ rowsList: currentRows.concat(newRow), \r\n valueAutoCompleteAdd: null, \r\n checked: false, \r\n idRowSelectedList: cuenta_alumno, \r\n saving: false }, ()=>{\r\n this.puntosRef.current.value = parseInt(this.state.valueAutoComplete.PUNTAJE);\r\n this.vtRef.current.scrollToRow(cuenta_alumno);\r\n funciones.showToast('s', 'Se registró el estudiante ' + cuenta_alumno);\r\n if (!movil)\r\n document.getElementById('combo-box-ctl').focus();\r\n });\r\n\r\n \r\n }\r\n else\r\n {\r\n \r\n this.setState({ saving: false }, ()=>{\r\n funciones.showToast('w', rows[0].RESP);\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\nhandleChangeCheckBox = (event) => {\r\n \r\nif (funciones.isEmpty(this.state.valueAutoCompleteAdd))\r\n{\r\n funciones.showToast('w', 'Debe seleccionar un estudiante');\r\n document.getElementById(\"combo-box-ctl\").focus();\r\n return;\r\n}\r\n\r\nthis.setState({ checked: event.target.checked });\r\n\r\n}\r\n\r\nlessButton = ()=>{\r\n\r\n if (parseInt(this.puntosRef.current.value) > 1)\r\n {\r\n this.puntosRef.current.value = parseInt(this.puntosRef.current.value) - 1;\r\n }\r\n\r\n}\r\n\r\nplusButton = ()=>{\r\n\r\n if (parseInt(this.puntosRef.current.value) < parseInt(this.state.valueAutoComplete.PUNTAJE))\r\n {\r\n this.puntosRef.current.value = parseInt(this.puntosRef.current.value) + 1;\r\n }\r\n\r\n}\r\n\r\nonChangePuntos = (event)=>{\r\n\r\n if (parseInt(event.target.value) > parseInt(this.state.valueAutoComplete.PUNTAJE))\r\n {\r\n event.target.value = parseInt(this.state.valueAutoComplete.PUNTAJE)\r\n }\r\n\r\n}\r\n\r\nregSalida = ()=>{\r\n this.setState({ actionModal: 2, openModalConfirm: true });\r\n}\r\n\r\nhandleClickDelete = ()=>{\r\n this.setState({ actionModal: 3, openModalConfirm: true });\r\n}\r\n\r\nhandleCloseConfirm = ()=>{\r\n this.setState({ openModalConfirm: false });\r\n}\r\n\r\nhandleOkConfirm = ()=>{\r\n\r\n this.setState({ openModalConfirm: false, openBackDrop: true }, ()=>{\r\n\r\n let cuenta_alumno = this.state.idRowSelectedList;\r\n let id_actividad = this.state.idRowSelected;\r\n let idAsistencia = this.state.actionModal === 2 ? 0 : this.state.rowsList.find(x => x.CUENTA_ALUMNO === cuenta_alumno).ID_ASISTENCIA_ALUMNO; \r\n\r\n new Request\r\n .post(`${globales.ip}/control_actividades_coprogramaticas/alumno/operaciones`)\r\n .set({'authorization': 'Bearer ' + Auth.getToken() })\r\n .set('Content-Type', 'application/json')\r\n .send({ tipo_proceso: this.state.actionModal, cuenta_alumno: cuenta_alumno, puntos: 0, id_actividad: id_actividad, id_asistencia_alumno: idAsistencia, ad_usuario: tokenInfo.user })\r\n .retry(0)\r\n .timeout({ response: 15000, 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 if (rows.length > 0) \r\n { \r\n if (rows[0].RESP === 'OK')\r\n { \r\n let currentRows = this.state.rowsList;\r\n \r\n if (this.state.actionModal === 2)\r\n {\r\n\r\n currentRows.map((item)=>{\r\n\r\n if (item.CUENTA_ALUMNO === this.state.idRowSelectedList)\r\n {\r\n item.HORA_SALIDA = rows[0].HORA_SALIDA;\r\n }\r\n\r\n return item;\r\n });\r\n\r\n }\r\n else if (this.state.actionModal === 3)\r\n {\r\n currentRows = currentRows.filter(x => x.ID_ASISTENCIA_ALUMNO !== idAsistencia);\r\n }\r\n\r\n this.setState({ rowsList: currentRows, openBackDrop: false }, ()=>{\r\n \r\n let msg = this.state.actionModal === 2 ? 'Se ha registrado la salida' : this.state.actionModal === 3 ? 'Se ha eliminado el registro de entrada' : null;\r\n funciones.showToast('s', msg);\r\n\r\n });\r\n\r\n }\r\n else\r\n {\r\n this.setState({ openBackDrop: false }, ()=>{ \r\n funciones.showToast('w', rows[0].RESP); \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\nonResize = ()=> { \r\n if (this.tablaListRef.current !== null && this.actionModalRef.current !== null)\r\n this.setState({ heightTableList: funciones.getHeightTableDialog(movil, this.tablaListRef, this.actionModalRef, 5) }); \r\n}\r\n\r\ncomponentDidMount() { \r\n\r\ntokenInfo = Auth.getProfile(); //Token decodificado\r\n \r\nthis.setState({ isLoggin: tokenInfo.plataforma !== undefined ? true : false }, ()=>{ \r\n\r\n if (tokenInfo.plataforma === 1) // Usuario Admin\r\n {\r\n this.obtenerCategorias(); \r\n }\r\n \r\n this.setState({ heightTableMain: funciones.getHeightTableMain(movil, this).heightTable }); \r\n \r\n\r\n}); \r\n \r\n}\r\n\r\nrender() {\r\nconst { classes } = this.props; \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 if (tokenInfo.plataforma === 1) //Si es Usuario Admin\r\n {\r\n \r\n return (\r\n \r\n \r\n
option.DESCRIPCION_CATEGORIA}\r\n style={{ width: !movil ? '420px' : '100%' }} \r\n renderInput={(params) => \r\n {this.state.loadingCategorias ? : null}\r\n {params.InputProps.endAdornment}\r\n \r\n )\r\n }}\r\n fullWidth\r\n />}\r\n renderOption={(option) => (\r\n \r\n {option.DESCRIPCION_CATEGORIA + ' (' + option.PUNTAJE + ' pts)'} \r\n \r\n )} \r\n onChange={this.onChangeAutocomplete} \r\n loading={this.state.loadingCategorias}\r\n value={this.state.valueAutoComplete}\r\n className={classes.textField}\r\n groupBy={(option) => option.NOMBRE_AREA} \r\n PaperComponent={(props)=>()} \r\n />\r\n \r\n { this.changeYear= true; }}\r\n /> \r\n \r\n \r\n { this.changeYear= true; }} \r\n /> \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n