Update and delete multi timesheets and tags (#1240)

assets/js/KimaiLoader.js

@@ -34,6 +34,7 @@ import KimaiFormSelect from "./plugins/KimaiFormSelect";
 import KimaiForm from "./plugins/KimaiForm";
 import KimaiDatePicker from "./plugins/KimaiDatePicker";
 import KimaiConfirmationLink from "./plugins/KimaiConfirmationLink";
+import KimaiMultiUpdateTable from "./plugins/KimaiMultiUpdateTable";
 
 export default class KimaiLoader {
 
@@ -67,6 +68,7 @@ export default class KimaiLoader {
         kimai.registerPlugin(new KimaiAutocomplete('.js-autocomplete'));
         kimai.registerPlugin(new KimaiForm());
         kimai.registerPlugin(new KimaiThemeInitializer());
+        kimai.registerPlugin(new KimaiMultiUpdateTable());
         //kimai.registerPlugin(new KimaiPauseRecord('li.messages-menu ul.menu li'));
 
         // notify all listeners that Kimai plugins can now be registered

assets/js/plugins/KimaiAlert.js

@@ -27,7 +27,7 @@ export default class KimaiAlert extends KimaiPlugin {
             message = translation.get(message);
         }
         Swal.fire({
-            type: 'error',
+            icon: 'error',
             title: title.replace('%reason%', ''),
             text: message,
         });
@@ -42,10 +42,11 @@ export default class KimaiAlert extends KimaiPlugin {
 
         Swal.fire({
             timer: 2000,
+            timerProgressBar: true,
             toast: true,
             position: 'top-end',
             showConfirmButton: false,
-            type: 'success',
+            icon: 'success',
             title: message,
         });
     }
@@ -65,7 +66,7 @@ export default class KimaiAlert extends KimaiPlugin {
 
         Swal.fire({
             title: message,
-            type: 'question',
+            icon: 'question',
             showCancelButton: true,
             confirmButtonText: translation.get('confirm'),
             cancelButtonText: translation.get('cancel')

assets/js/plugins/KimaiConfirmationLink.js

@@ -30,15 +30,30 @@ export default class KimaiConfirmationLink extends KimaiPlugin {
                 if (target.classList.contains(self.selector)) {
                     const attributes = target.dataset;
 
+                    // is this a link? 
                     let url = attributes['href'];
+                    // or another HTML element with a custom href 
                     if (!url) {
                         url = target.getAttribute('href');
                     }
+                    
+                    // or is this a button?
+                    let form = null;
+                    if (target.type === 'submit' && target.form !== undefined) {
+                        form = target.form;
+                    }
 
                     if (attributes.question !== undefined) {
                         self.getContainer().getPlugin('alert').question(attributes.question, function(value) {
                             if (value) {
-                                document.location = url;
+                                if (form === null) {
+                                    document.location = url;
+                                } else {
+                                    if (url !== null) {
+                                        form.action = url;
+                                    }
+                                    form.submit();
+                                }
                             }
                         });
                     }

assets/js/plugins/KimaiFormSelect.js

@@ -51,6 +51,7 @@ export default class KimaiFormSelect extends KimaiPlugin {
     updateOptions(selectIdentifier, data) {
         let select = jQuery(selectIdentifier);
         let emptyOption = jQuery(selectIdentifier + ' option[value=""]');
+        const selectedValue = select.val();
 
         select.find('option').remove().end().find('optgroup').remove().end();
 
@@ -79,6 +80,9 @@ export default class KimaiFormSelect extends KimaiPlugin {
         select.append(htmlOptions);
         select.append(emptyOptions);
 
+        // if available, re-select the previous selected option (mostly usable for global activities)
+        select.val(selectedValue);
+
         // if we don't trigger the change, the other selects won't be resetted
         select.trigger('change');
 

assets/js/plugins/KimaiMultiUpdateTable.js

@@ -0,0 +1,73 @@
+/*
+ * This file is part of the Kimai time-tracking app.
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+/*!
+ * [KIMAI] KimaiMultiUpdateForm: handle the multi update checkbox list and form
+ */
+
+import KimaiPlugin from '../KimaiPlugin';
+import jQuery from "jquery";
+
+export default class KimaiMultiUpdateTable extends KimaiPlugin {
+
+    init() {
+        const self = this;
+        
+        jQuery('body').
+            on('change', '#multi_update_all', function(event) {
+                jQuery('.multi_update_single').prop('checked', jQuery(event.target).prop('checked'));
+                self.toggleForm();
+            })
+            .on('change', '.multi_update_single', function(event) {
+                self.toggleForm();
+            })
+            .on('change', '#multi_update_table_action', function(event) {
+                const selectedItem = jQuery('#multi_update_table_action option:selected');
+                const selectedVal = selectedItem.val();
+
+                if (selectedVal === '') {
+                    return;
+                }
+                
+                const form = jQuery('#multi_update_form form');
+                const selectedText = selectedItem.text();
+                const ids = self.getSelectedIds();
+                const question = form.attr('data-question').replace(/%action%/, selectedText).replace(/%count%/, ids.length);
+                
+                self.getContainer().getPlugin('alert').question(question, function(value) {
+                    if (value) {
+                        form.attr('action', selectedVal).submit();
+                    } else {
+                        jQuery('#multi_update_table_action').val('').trigger('change');
+                    }
+                });
+            });
+    }
+    
+    getSelectedIds()
+    {
+        let ids = [];
+        jQuery('.multi_update_single:checked').each(function(i){
+            ids[i] = $(this).val();
+        });
+
+        return ids;
+    }
+    
+    toggleForm() 
+    {
+        const ids = this.getSelectedIds();
+        jQuery('#multi_update_table_entities').val(ids.join(','));
+
+        if (ids.length > 0) {
+            jQuery('#multi_update_form').show();
+        } else {
+            jQuery('#multi_update_form').hide();
+        }
+    }
+    
+}