plantillaEjemplo.php 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <?php
  2. $strModulo = 'PRUEBA';
  3. ?>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8. <meta http-equiv="imagetoolbar" content="no" />
  9. <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Poppins:400,500,700,300,600">
  10. <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans">
  11. <link media="screen" rel="stylesheet" type="text/css" href="css/principal.css" />
  12. <!--<link media="screen" rel="stylesheet" type="text/css" href="css/pagination.css" />--> <!--Paginador-->
  13. <link rel="shortcut icon" type="image/x-icon" href="css/layout/global/sp.ico" />
  14. <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/dojo/1.14.1/dijit/themes/claro/claro.css">
  15. <script src="//ajax.googleapis.com/ajax/libs/dojo/1.14.1/dojo/dojo.js" data-dojo-config="async: true, parseOnLoad:true"></script>
  16. <script type="application/javascript">
  17. // Cargamos los complementos de dojo
  18. require(["dojo/dom", "dojo/_base/fx", "dojo/_base/array", "dojo/query", "dojo/dom-construct", "dijit/registry", "dojo/dom-style", "dojo/ready", "dojo/on", "dojo/window",
  19. "dojo/store/Memory", "dijit/form/FilteringSelect", "dijit/form/Button", "dojo/dom-class", "dijit/Dialog",
  20. "dojo/_base/lang", "dojox/grid/DataGrid", "dojo/data/ItemFileWriteStore", "dojox/grid/enhanced/plugins/DnD", "dojox/grid/EnhancedGrid", "dojox/grid/enhanced/plugins/Selector", "dojox/grid/enhanced/plugins/IndirectSelection", "dojox/grid/enhanced/plugins/NestedSorting",
  21. "dijit/ProgressBar", "dijit/ConfirmDialog", "dojo/dom-style", "dijit/form/ComboButton", "dijit/Menu", "dijit/MenuItem", "dijit/MenuSeparator", "dijit/Tooltip", "dijit/form/Form", "dijit/form/TextBox",
  22. "dojox/grid/enhanced/plugins/Filter", "dijit/form/ValidationTextBox", "dijit/form/NumberSpinner", "dojo/request", "dojo/parser"],
  23. function(dom, fx, array, query, domConstruct, dijit, style, ready, on, win,
  24. Memory, FilteringSelect, Button, domClass, Dialog,
  25. lang, DataGrid, ItemFileWriteStore, DnDConfig, EnhancedGrid, Selector, indirectSelection, nestedSorting,
  26. ProgressBar, ConfirmDialog, style, ComboButton, Menu, MenuItem, MenuSeparator, Tooltip, Form, TextBox, filter, ValidationTextBox, NumberSpinner, request) {
  27. const urlPeticiones = "plantillaEjemplo_DO.php";
  28. const idModulo = "<?php echo($strModulo);?>";
  29. // Para Mostrar de Mensajes de "error o éxito"
  30. var dgEjecuta = new Dialog({title: 'Procesando...', style: 'width:300px'});
  31. var pbMarcar = new ProgressBar({value: Number.POSITIVE_INFINITY, layoutAlign: 'left'});
  32. dgEjecuta.setContent(pbMarcar);
  33. dgResultadoError = new ConfirmDialog({ title:"<b>Error</b>", style: "min-width:300px; heigth; auto" });
  34. style.set(dgResultadoError.cancelButton.domNode, 'display', 'none');
  35. dgResultadoExito = new ConfirmDialog({ title:"<b>Éxito</b>", style: "min-width:300px; heigth; auto" });
  36. style.set(dgResultadoExito.cancelButton.domNode, 'display', 'none');
  37. /****************************************************************** Botones ******************************************************************/
  38. // Limpiar
  39. new Button({
  40. label: "Limpiar",
  41. iconClass: "dijitEditorIcon dijitEditorIconRemoveFormat",
  42. showLabel: true,
  43. onClick: function() {
  44. dijit.byId("frm").submit();
  45. }
  46. }, "BTNLIMPIAR").startup();
  47. // Buscar
  48. new Button({
  49. id: "BTNBUSCAR",
  50. label: "Buscar",
  51. iconClass: "dijitIcon dijitIconDatabase",
  52. showLabel: true,
  53. onClick: function(){
  54. alert("Buscando");
  55. }
  56. }, "BTNBUSCAR").startup();
  57. // Buscar
  58. new Button({
  59. id: "BTNPETICION",
  60. label: "Realizar Petición",
  61. iconClass: "dijitIconFunction",
  62. showLabel: true,
  63. onClick: function(){
  64. realizaAccion("buscarDatos");
  65. }
  66. }, "BTNPETICION").startup();
  67. /****************************************************************** Acciones ******************************************************************/
  68. realizaAccion = function (accion){
  69. dgEjecuta.set("title", "Consultando...");
  70. dgEjecuta.show();
  71. request.post(urlPeticiones, {
  72. data: {
  73. accion: accion,
  74. idModulo: idModulo,
  75. dato1: "prueba"
  76. }
  77. }).then(
  78. function (response) {
  79. var objResponse = JSON.parse(response);
  80. if (objResponse['estatus'] == "ERROR") {
  81. dgEjecuta.hide();
  82. dgResultadoError.setContent(objResponse['errorDescripcion']);
  83. dgResultadoError.show();
  84. } else {
  85. let datosRecibidos = objResponse["datosRecibidos"];
  86. console.log(datosRecibidos);
  87. dgEjecuta.hide();
  88. }
  89. }
  90. );
  91. };
  92. ready(function() {
  93. // Actualizar el tamaño del TabContainer en función del tamaño de página
  94. var ventana = win.getBox();
  95. var strVentana = (ventana.h-75-100)+"px";
  96. style.set(dijit.byId("djTab").id, { height:strVentana });
  97. dijit.byId("djTab").resize();
  98. // Actualizar el tamaño del TabContainer en función del tamaño de página
  99. on(window, "resize", function() {
  100. var ventana = win.getBox();
  101. var strVentana = (ventana.h-75-100)+"px";
  102. style.set(dijit.byId("djTab").id, { height:strVentana });
  103. dijit.byId("djTab").resize();
  104. });
  105. // Eliminar la cortina de entrada
  106. fx.fadeOut({node: dom.byId("loadingOverlay"), duration: 1}).play();
  107. setTimeout(function () {
  108. domConstruct.destroy("loadingOverlay");
  109. }, 1);
  110. });
  111. });
  112. </script>
  113. </head>
  114. <body class="claro">
  115. <div id="loadingOverlay" class="loadingOverlay pageOverlay">
  116. <div class="loadingMessage">Espere...</div>
  117. </div>
  118. <div id="wrapper_container_module">
  119. <div id="wrapper_table" style="position:relative;">
  120. <div data-dojo-type="dijit/form/Form" id="frm" data-dojo-id="frm" encType="multipart/form-data"
  121. action="<?php echo($_SERVER['PHP_SELF']); ?>" method="post" style="position:relative;">
  122. <script type="dojo/on" data-dojo-event="submit">return true;</script>
  123. <div id="wrapper_table_head">Ejemplo</div>
  124. <div id="wrapper_table_body_mod_app">
  125. <table width="100%" height="auto">
  126. <tr>
  127. <td width="100%" colspan="20" align="center">
  128. </tr>
  129. <tr>
  130. <td width="100%" colspan="20" align="center">
  131. <button id="BTNBUSCAR" type="button"></button>
  132. <button id="BTNLIMPIAR" type="button"></button>
  133. <button id="BTNPETICION" type="button"></button>
  134. </td>
  135. </tr>
  136. </table>
  137. <div id="djTab" data-dojo-type="dijit/layout/TabContainer" data-dojo-props="tabPosition:'top'" style="width:100%;">
  138. <div data-dojo-type="dijit/layout/ContentPane" title="Ejemplo" data-dojo-props="selected:true">
  139. <div style="margin-top: 15px">
  140. <div id="div_GridPrincipal"></div>
  141. </div>
  142. </div>
  143. </div>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. </body>