quarantine: attachement info: show count & total size summary in header

[pmg-gui.git] / js / AttachmentGrid.js

diff --git a/js/AttachmentGrid.js b/js/AttachmentGrid.js
index 8943f0939466442cff7bd9a57ed7376f5902ccb4..aea526ba5003da01ad3d9ede56e8abb4174234fe 100644 (file)
--- a/js/AttachmentGrid.js
+++ b/js/AttachmentGrid.js
@@ -5,6 +5,16 @@ Ext.define('PMG.grid.AttachmentGrid', {
 
     showDownloads: true,
 
+    title: gettext('Attachments'),
+    iconCls: 'fa fa-paperclip',
+
+    minHeight: 50,
+    maxHeight: 250,
+    scrollable: true,
+
+    collapsible: true,
+    titleCollapse: true,
+
     store: {
        autoDestroy: true,
        fields: ['name', 'content-type', 'size'],
@@ -13,6 +23,41 @@ Ext.define('PMG.grid.AttachmentGrid', {
        },
     },
 
+    controller: {
+       xclass: 'Ext.app.ViewController',
+       init: function(view) {
+           view.store.on('load', this.onLoad, this);
+       },
+       onLoad: function(store, records, success) {
+           let me = this;
+           let view = me.getView();
+           if (!success) {
+               view.updateTitleStats(-1);
+               return;
+           }
+           let totalSize = records.reduce((sum, { data }) => sum + data.size, 0);
+           view.updateTitleStats(records.length, totalSize);
+       },
+    },
+
+    updateTitleStats: function(count, totalSize) {
+       let me = this;
+       let title;
+       if (count > 0) {
+           title = Ext.String.format(gettext('{0} Attachements'), count);
+           title += ` (${Proxmox.Utils.format_size(totalSize)})`;
+           if (me.collapsible) {
+               me.expand();
+           }
+       } else {
+           title = gettext('No Attachments');
+           if (me.collapsible) {
+               me.collapse();
+           }
+       }
+       me.setTitle(title);
+    },
+
     setID: function(rec) {
        var me = this;
        if (!rec || !rec.data || !rec.data.id) {