procedure_versions.html 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml"
  3. xmlns:th="http://www.thymeleaf.org"
  4. lang="es">
  5. <head th:replace="~{layouts/common.html :: head}"></head>
  6. <body id="page-top">
  7. <!-- Content -->
  8. <div class="content uv-content d-flex" id="uv-wrapper" style="margin-top:-20px !important">
  9. <div class="container uv-home-section" id="uv-content-wrapper">
  10. <div class="uv-loading-spinner" th:text="#{global.loading}"></div>
  11. <div class="col-sm-12"></div>
  12. <div class="uv-container">
  13. <div class="uv-table-group-procedure-info">
  14. <div class="uv-table-title">
  15. <span><strong>Borradores disponibles de la tarea:</strong></span>
  16. <div class="row">
  17. <div class="col-8">
  18. <select class="selectpicker" id="versionSelector" name="versions" data-live-search="true" data-width="100%" data-actions-box="true" th:attr="data-none-selected-text=#{global.selectors.noData}" required>
  19. <option th:each="item,i : ${versions}" th:value="${item.dataMod}" th:text="${item.usuari + ' - ' + item.dataMod}"></option>
  20. </select>
  21. </div>
  22. <div class="col-4"><span class="btn btn-primary pointer" onclick="restoreDraft();">Restaurar</span></div>
  23. </div>
  24. </div>
  25. <hr class="uv-procedure-hr">
  26. </div>
  27. <div class="uv-table-group">
  28. <textarea id="editor" name="evidencia_text" th:text="''"></textarea>
  29. </div>
  30. <div class="uv-accordion" style="margin-top:20px;text-align:center;">
  31. </div>
  32. </div>
  33. </div>
  34. </div>
  35. <input type="hidden" id="idInstanciaTasca" th:value="${idInstanciaTasca}">
  36. <!-- Footer -->
  37. <footer class="uv-footer uv-footer-text" th:replace="~{layouts/common.html :: footer}"></footer>
  38. <script th:src="@{/js/jquery/jquery.min.js}"></script>
  39. <script th:src="@{/js/bootstrap/bootstrap.min.js}"></script>
  40. <script th:src="@{/js/fa/all.js}"></script>
  41. <script th:src="@{/js/jquery/jquery.dataTables.min.js}"></script>
  42. <script th:src="@{/js/jquery/jquery.dataTables.responsive.min.js}"></script>
  43. <script th:src="@{/js/jquery/jquery.dataTables.rowReorder.min.js}"></script>
  44. <script th:src="@{/js/bootstrap/dataTables.bootstrap4.min.js}"></script>
  45. <script th:src="@{/js/jquery-easing/jquery.easing.min.js}"></script>
  46. <script th:src="@{/js/saic.js}"></script>
  47. <script th:src="@{/js/bootstrap-select/bootstrap-select.js}"></script>
  48. <script th:src="@{/js/bootstrap-select/i18n/defaults-es_ES.js}" th:if="${#locale.language} == 'es'"></script>
  49. <script th:src="@{/js/bootstrap-select/i18n/defaults-ca_CA.js}" th:if="${#locale.language} != 'es'"></script>
  50. <script th:inline="javascript">
  51. if (!window.Worker) {
  52. alert(/*[[#{procedures.nosupported}]]*/);
  53. window.location = '/';
  54. }
  55. var aliveWorker;
  56. var saveWorker;
  57. function confirmDelete(){ }
  58. function confirmClear(){ }
  59. function setSaveInterval(){
  60. console.log('AutoSave enabled');
  61. saveWorker = new Worker(/*[[@{/js/workers/autosave_worker.js}]]*/);
  62. saveWorker.onmessage = triggerSave;
  63. }
  64. function setAliveInterval(){
  65. console.log('KeepAlive enabled');
  66. aliveWorker = new Worker(/*[[@{/js/workers/alive_worker.js}]]*/);
  67. aliveWorker.onmessage = keepalive;
  68. }
  69. var tinyplugins = 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists charmap quickbars checklist tinycomments';
  70. var tinytoolbar = 'save | undo redo | bold italic underline strikethrough | forecolor backcolor | fontfamily fontsize | removeformat | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | showcomments | charmap | topdf | fullscreen ';
  71. var tinymenu = 'file edit';
  72. var tinytable = 'tableinsertrowbefore tableinsertrowafter tabledeleterow';
  73. var tinycontextmenu = '';
  74. var tinytableappearance = false;
  75. var tinytableclass = [];
  76. var tinytableresizebars = false;
  77. var tinyadvtab = false;
  78. var tinyobjectresizing = false;
  79. function tinyconfigure(editor){
  80. editor.on('keydown', function(e) {
  81. if (e.keyCode == 8 || e.keyCode == 46) { //backspace and delete keycodes
  82. try {
  83. var elem = tinymce.activeEditor.selection.getNode(); //current caret node
  84. console.log(elem);
  85. if (elem.classList.contains("mceNonEditable")) {
  86. e.preventDefault();
  87. return false;
  88. }
  89. } catch (e) {console.log(e);}
  90. }
  91. });
  92. editor.ui.registry.addIcon('save', '<i style="font-size:125%;" class="fas fa-save"></i>')
  93. editor.ui.registry.addButton('topdf', {
  94. icon: 'print',
  95. tooltip: 'Imprimir a PDF',
  96. onAction: function(_){
  97. print_to_pdf(editor.getContent());
  98. }
  99. });
  100. editor.on('FullscreenStateChanged', function () {
  101. if(tinymce.activeEditor.plugins.fullscreen.isFullscreen()){
  102. var e = '<span id="exitFullScreen" class="btn btn-primary pointer" style="position:absolute;display:none;float:right;right:15px;top:25px;color:white;background-color:#007bff;padding:8px;cursor:pointer;" onclick="tinymce.activeEditor.execCommand('+"'mceFullScreen'"+');">Volver a SAIC <i class="fas fa-compress-arrows-alt"></i></span>';
  103. $(e).appendTo($($('.tox-editor-container').get(0)));
  104. $('#exitFullScreen').show();
  105. }
  106. else{
  107. $('#exitFullScreen').remove();
  108. }
  109. });
  110. }
  111. </script>
  112. <script type="text/javascript">
  113. var locale = "[[${#locale.language}]]";
  114. var fileInvalid = "[[#{procedures.extensionAlert}]]";
  115. var fullname = "[[${#authentication.principal.nom + ' ' + #authentication.principal.cognoms}]]";
  116. var username = "[[${#authentication.principal.usuari}]]";
  117. var msgsave = "[[#{procedures.editor.msgsave}]]";
  118. var expiredTxt = "[[#{procedures.session.expired}]]";
  119. var layout;
  120. var lastActiveTime = new Date().getTime();
  121. var manualDraftSave = false;
  122. $(document).ready(function(){
  123. layout = new Layout("");
  124. layout.initTableLayout({paging:false});
  125. layout.closeLoadingSpinner(".uv-loading-spinner");
  126. $('#versionSelector').change(getDraft);
  127. tinymce.init({
  128. selector: '#editor',
  129. language: locale,
  130. browser_spellcheck: true,
  131. plugins: tinyplugins,
  132. menubar: tinymenu,
  133. toolbar: tinytoolbar,
  134. table_toolbar: tinytable,
  135. tinycomments_author: username,
  136. tinycomments_author_name: fullname,
  137. tinycomments_mode: 'embedded',
  138. tinycomments_can_delete: function(req, done, fail){ done({canDelete: true}); },
  139. table_advtab: tinyadvtab,
  140. table_row_advtab: tinyadvtab,
  141. table_cell_advtab: tinyadvtab,
  142. table_sizing_mode: 'fixed',
  143. table_default_styles: {
  144. width: '297mm'
  145. },
  146. content_style: "body { width: 297mm; max-width: 297mm; font-size: 10pt; font-family: Verdana, Geneva, sans-serif; font-style: normal; font-variant: normal;}",
  147. font_formats: "Arial=arial,helvetica,sans-serif; Verdana=verdana,geneva;",
  148. font_size_formats: '8pt 10pt 12pt 14pt 16pt 18pt 24pt',
  149. setup: tinyconfigure,
  150. save_onsavecallback: function(){save_content();},
  151. content_langs: [
  152. {title: 'Español', code: 'es'},
  153. {title: 'Valencià', code: 'ca'}],
  154. image_advtab: true,
  155. importcss_append: true,
  156. height: 700,
  157. image_caption: true,
  158. quickbars_selection_toolbar: '',
  159. toolbar_mode: 'sliding',
  160. contextmenu: tinycontextmenu,
  161. table_appearance_options: tinytableappearance,
  162. table_class_list: tinytableclass,
  163. table_resize_bars: tinytableresizebars
  164. });
  165. window.setTimeout(getDraft, 2000);
  166. });
  167. function getDraft(){
  168. $.get(`/procedure/draft/${$('#idInstanciaTasca').val()}`, {dataMod: $('#versionSelector').val()}, function(obj){
  169. var data = $($.parseHTML(obj.text)).find('#editorContent').html();
  170. tinymce.activeEditor.setContent(obj.text);
  171. });
  172. }
  173. function restoreDraft(){
  174. $.post(`/procedure/draft/${$('#idInstanciaTasca').val()}`, {dataMod: $('#versionSelector').val()}, function(data){
  175. if(data === '1'){
  176. alert('Borrador restaurado correctamente. Cierre esta ventana y actualice la página del procedimiento para ver los cambios.');
  177. }
  178. else{
  179. alert('No se ha podido restaurar el borrador.');
  180. }
  181. });
  182. }
  183. </script>
  184. </body>
  185. </html>