client.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. // @ts-ignore Import module
  2. import { createApp, reactive } from 'https://unpkg.com/petite-vue?module';
  3. const webServices = {
  4. getPeriodosV1: async () => {
  5. try {
  6. const response = await fetch('periodos.v1.php');
  7. return await response.json();
  8. }
  9. catch (error) {
  10. console.log(error);
  11. return [];
  12. }
  13. },
  14. getPeriodosV2: async () => {
  15. try {
  16. const response = await fetch('periodos.v2.php');
  17. return await response.json();
  18. }
  19. catch (error) {
  20. console.log(error);
  21. return [];
  22. }
  23. }
  24. };
  25. const store = reactive({
  26. periodosV1: [],
  27. periodosV2: [],
  28. errors: [],
  29. fechas(idPeriodo) {
  30. const periodo = this.periodosV2.find((periodo) => periodo.IdPeriodo === idPeriodo);
  31. return {
  32. inicio: periodo ? periodo.FechaInicio : '',
  33. fin: periodo ? periodo.FechaFin : ''
  34. };
  35. },
  36. periodov1(idPeriodo) {
  37. return this.periodosV1.find((periodo) => periodo.IdPeriodo === idPeriodo);
  38. },
  39. periodov2(idPeriodo) {
  40. return this.periodosV2.filter((periodo) => periodo.IdPeriodo === idPeriodo);
  41. },
  42. async addPeriodo(periodo) {
  43. try {
  44. const result = await fetch('backend/periodos.php', {
  45. method: 'POST',
  46. body: JSON.stringify({
  47. ...periodo,
  48. ...this.fechas(periodo.IdPeriodo)
  49. }),
  50. headers: {
  51. 'Content-Type': 'application/json'
  52. }
  53. }).then((response) => response.json());
  54. if (result.success) {
  55. this.periodosV1 = this.periodosV1.map((periodoV1) => {
  56. if (periodoV1.IdPeriodo === periodo.IdPeriodo) {
  57. periodoV1.in_db = true;
  58. }
  59. return periodoV1;
  60. });
  61. return result;
  62. }
  63. else {
  64. this.errors.push(result.message);
  65. }
  66. }
  67. catch (error) {
  68. this.errors.push(error);
  69. }
  70. },
  71. async addCarreras(idPeriodo) {
  72. try {
  73. const periodoV1 = this.periodov1(idPeriodo);
  74. const periodoV2 = this.periodov2(idPeriodo);
  75. const data = periodoV2.map(({ ClaveCarrera, NombreCarrera }) => ({
  76. ClaveCarrera: ClaveCarrera,
  77. NombreCarrera: NombreCarrera,
  78. IdNivel: periodoV1.IdNivel,
  79. }));
  80. const result = await fetch('backend/carreras.php', {
  81. method: 'POST',
  82. body: JSON.stringify(data),
  83. headers: {
  84. 'Content-Type': 'application/json'
  85. }
  86. }).then((response) => response.json());
  87. if (result.success) {
  88. await webServices.getPeriodosV1().then((periodosV1) => {
  89. this.periodosV1 = periodosV1;
  90. });
  91. await webServices.getPeriodosV2().then((periodosV2) => {
  92. this.periodosV2 = periodosV2;
  93. });
  94. }
  95. }
  96. catch (error) {
  97. this.errors.push(error);
  98. }
  99. }
  100. });
  101. createApp({
  102. store,
  103. info(IdPeriodo) {
  104. const periodo = store.periodosV2.find((periodo) => periodo.IdPeriodo === IdPeriodo &&
  105. periodo.FechaInicio != '' && periodo.FechaFin != '');
  106. return periodo;
  107. },
  108. complete(IdPeriodo) {
  109. const info = this.info(IdPeriodo);
  110. return info !== undefined;
  111. },
  112. mounted: async () => {
  113. await webServices.getPeriodosV1().then((periodosV1) => {
  114. store.periodosV1 = periodosV1;
  115. });
  116. await webServices.getPeriodosV2().then((periodosV2) => {
  117. store.periodosV2 = periodosV2;
  118. });
  119. }
  120. }).mount();