From fc480dd559be0d525983ceae645e05ec36f03f6a Mon Sep 17 00:00:00 2001
From: Anton Romanov <a.romanov@ulstu.ru>
Date: Thu, 30 Jan 2025 01:54:12 +0400
Subject: [PATCH] Partially add file upload

---
 .../public/js/bootstrap.file-input.js         | 24 ++++++
 .../templates/aspirant/editReport.html        | 77 +++++++++++++++++++
 2 files changed, 101 insertions(+)
 create mode 100644 src/main/resources/public/js/bootstrap.file-input.js

diff --git a/src/main/resources/public/js/bootstrap.file-input.js b/src/main/resources/public/js/bootstrap.file-input.js
new file mode 100644
index 0000000..2371503
--- /dev/null
+++ b/src/main/resources/public/js/bootstrap.file-input.js
@@ -0,0 +1,24 @@
+(function($) {
+$.fn.bootstrapFileInput = function(loadDirectory = false) {
+    var fileInput = $('<input type="file" class="input-ghost" ' + (loadDirectory ? 'webkitdirectory' : '') +' style="visibility:hidden; height:0">');
+    fileInput.change(function() {
+        $('#file-input-list').html('');
+        const files = $(this).prop('files');
+        if (files.length == 0) {
+            return;
+        }
+        var filesList = '';
+        $.each(files, function(index, file){
+             filesList += '<div style="overflow: hidden"><span id="file-' + index + '"><i class="fa fa-circle-o"></i> ' + file.name + '</span></div>';
+        });
+        $('#file-input-list').html(filesList);
+    });
+    $(this).find('button.btn-choose').click(function() {
+        fileInput.click();
+    });
+    $(this).find('input').mousedown(function() {
+        return false;
+    });
+    $(this).append(fileInput);
+};
+})(jQuery);
diff --git a/src/main/resources/templates/aspirant/editReport.html b/src/main/resources/templates/aspirant/editReport.html
index 5894652..4efa54a 100644
--- a/src/main/resources/templates/aspirant/editReport.html
+++ b/src/main/resources/templates/aspirant/editReport.html
@@ -11,7 +11,84 @@
 
         <div class="form-group" th:each="i, ind : ${indicators}">
             <label th:text="${i.name}"></label>
+            <div class="form-group">
+                <button class="form-control btn btn-danger" type="button" onclick="deleteAllFiles();">Удалить все
+                    документы
+                </button>
+            </div>
+            <div id="input-file" class="form-group">
+                <button class="btn btn-primary btn-upload btn-choose pull-right" type="button">Обзор</button>
+                <button class="btn btn-success btn-upload" type="button" onclick="uploadFile();">Загрузить</button>
+            </div>
+            <div id="file-input-list" class="form-group">
+
+            </div>
         </div>
+        <th:block layout:fragment="scripts">
+            <script src="/js/bootstrap.file-input.js"></script>
+            <script th:inline="javascript">
+                /*<![CDATA[*/
+                $(document).ready(function() {
+                    uploadFile = function(index = 0) {
+                        const files = $('#input-file .input-ghost').prop('files');
+                        if (index == 0) {
+                            showFeedbackMessage();
+                            $('button').prop('disabled', true);
+                        }
+                        if (index >= files.length) {
+                            $('button').prop('disabled', false);
+                            $('#input-file .input-ghost').val('');
+                            return;
+                        }
+                        $('#file-' + index + ' i').removeClass('fa-circle-o').addClass('fa-circle-o-notch fa-spin');
+                        $('#file-' + index).removeClass('alert-danger alert-success');
+                        var response = false;
+                        var formData = new FormData();
+                        formData.append('file', files[index]);
+                        uploadAjax('api/1.0/documents.upload', formData,
+                            (result) => {
+                                if (!result) {
+                                    return;
+                                }
+                                response = result.response;
+                            },
+                            null,
+                            () => {
+                                var resultIcon = 'fa-times-circle-o';
+                                var resultStyle = 'alert-danger';
+                                if (response) {
+                                    resultIcon = 'fa-check-circle-o';
+                                    resultStyle = 'alert-success';
+                                }
+                                $('#file-' + index + ' i').removeClass('fa-circle-o-notch fa-spin').addClass(resultIcon);
+                                $('#file-' + index).addClass(resultStyle);
+                                uploadFile(index + 1);
+                            });
+                    };
+                    deleteAllFiles = function() {
+                        $('#file-input-list').html('');
+                        //input.replaceWith(input = input.val('').clone(true));
+                        $('#spinner').show()
+                        getAjax('api/1.0/documents.delete_all',
+                            (result) => {
+                                if (result.response) {
+                                    showFeedbackMessage('Удалено ' + result.response + ' документов');
+                                }
+                                if (result.error) {
+                                    showFeedbackMessage(result.error, 'danger');
+                                }
+                            },
+                            null,
+                            () => $('#spinner').hide(),
+                            'DELETE'
+                        );
+                    };
+                    $('#input-file').bootstrapFileInput(true);
+                });
+                /*]]>*/
+
+            </script>
+        </th:block>
 
         <button name="save" type="submit" class="btn btn-outline-dark">Сохранить</button>
         <button name="delete"