From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 080187B290 for ; Tue, 11 May 2021 18:18:26 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id E1EF024245 for ; Tue, 11 May 2021 18:17:55 +0200 (CEST) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [94.136.29.106]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS id 7A274241DC for ; Tue, 11 May 2021 18:17:54 +0200 (CEST) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 4CCE542E3B for ; Tue, 11 May 2021 18:17:54 +0200 (CEST) Message-ID: Date: Tue, 11 May 2021 18:17:53 +0200 MIME-Version: 1.0 User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:89.0) Gecko/20100101 Thunderbird/89.0 Content-Language: en-US To: Proxmox Backup Server development discussion , Dominik Csapak References: <20210511124256.15324-1-d.csapak@proxmox.com> From: Thomas Lamprecht In-Reply-To: <20210511124256.15324-1-d.csapak@proxmox.com> Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 7bit X-SPAM-LEVEL: Spam detection results: 0 AWL 0.007 Adjusted score from AWL reputation of From: address KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment NICE_REPLY_A -0.001 Looks like a legit reply (A) SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record URIBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to URIBL was blocked. See http://wiki.apache.org/spamassassin/DnsBlocklists#dnsbl-block for more information. [content.store, rec.data, node.data, values.store] Subject: Re: [pbs-devel] [PATCH proxmox-backup] ui: tape/BackupOverview: add 'restore partial' button X-BeenThere: pbs-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Backup Server development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Tue, 11 May 2021 16:18:26 -0000 On 11.05.21 14:42, Dominik Csapak wrote: > this opens the restore window, but with a snapshot selector, so that > the user can select the snapshots to restore > > includes a textfield for basic filtering why isn't that handled directly in the restore window, without extra buttons? Could possibly be a radio group there. I really want to avoid many buttons in places like top-bars, makes it crowded and confusing.. Also, why doesn't this uses action buttons for those things like the content tree? IMO we should try to be consistent with UX, cross-product this may be hard and lots of work, but I do not see any excuse for intra-product consistency (especially on rather simple UIs like PBS, compared to PVE). > > Signed-off-by: Dominik Csapak > --- > www/tape/BackupOverview.js | 31 ++++++++ > www/tape/window/TapeRestore.js | 125 +++++++++++++++++++++++++++++++++ > 2 files changed, 156 insertions(+) > > diff --git a/www/tape/BackupOverview.js b/www/tape/BackupOverview.js > index c028d58d..e039595d 100644 > --- a/www/tape/BackupOverview.js > +++ b/www/tape/BackupOverview.js > @@ -48,6 +48,29 @@ Ext.define('PBS.TapeManagement.BackupOverview', { > }).show(); > }, > > + restoreList: function(button, record) { > + let me = this; > + let view = me.getView(); > + let selection = view.getSelection(); > + if (!selection || selection.length < 1) { > + return; > + } > + > + let node = selection[0]; > + let mediaset = node.data.text; > + let uuid = node.data['media-set-uuid']; > + Ext.create('PBS.TapeManagement.TapeRestoreWindow', { > + mediaset, > + uuid, > + list_snapshots: true, > + listeners: { > + destroy: function() { > + me.reload(); > + }, > + }, > + }).show(); > + }, > + > restore: function(button, record) { > let me = this; > let view = me.getView(); > @@ -295,6 +318,14 @@ Ext.define('PBS.TapeManagement.BackupOverview', { > parentXType: 'treepanel', > enableFn: (rec) => !!rec.data['media-set-uuid'], > }, > + { > + xtype: 'proxmoxButton', > + disabled: true, > + text: gettext('Restore partial Media Set'), really long button text's should be avoided... > + handler: 'restoreList', > + parentXType: 'treepanel', > + enableFn: (rec) => !!rec.data['media-set-uuid'], > + }, > { > xtype: 'proxmoxButton', > disabled: true, > diff --git a/www/tape/window/TapeRestore.js b/www/tape/window/TapeRestore.js > index 7e4f5cae..560d4812 100644 > --- a/www/tape/window/TapeRestore.js > +++ b/www/tape/window/TapeRestore.js > @@ -49,6 +49,10 @@ Ext.define('PBS.TapeManagement.TapeRestoreWindow', { > values.snapshots = me.up('window').list; > } > > + if (Ext.isString(values.snapshots)) { > + values.snapshots = values.snapshots.split(','); > + } > + > values.store = datastores.join(','); > > return values; > @@ -138,6 +142,23 @@ Ext.define('PBS.TapeManagement.TapeRestoreWindow', { > defaultBindProperty: 'value', > hidden: true, > }, > + { > + fieldLabel: gettext('Snapshot Selection'), > + labelWidth: 200, > + cbind: { > + hidden: '{!list_snapshots}', > + }, > + reference: 'snapshotLabel', > + xtype: 'displayfield', > + }, > + { > + xtype: 'pbsTapeSnapshotGrid', > + reference: 'snapshotGrid', > + name: 'snapshots', > + cbind: { > + hidden: '{!list_snapshots}', > + }, > + }, > ], > }, > ], > @@ -186,6 +207,9 @@ Ext.define('PBS.TapeManagement.TapeRestoreWindow', { > datastores[content.store] = true; > } > me.setDataStores(Object.keys(datastores)); > + let store = me.lookup('snapshotGrid').getStore(); > + store.setData(response.result.data); > + store.sort('snapshot'); > }, > failure: function() { > // ignore failing api call, maybe catalog is missing > @@ -308,3 +332,104 @@ Ext.define('PBS.TapeManagement.DataStoreMappingGrid', { > }, > ], > }); > + > +Ext.define('PBS.TapeManagement.SnapshotGrid', { > + extend: 'Ext.grid.Panel', > + alias: 'widget.pbsTapeSnapshotGrid', > + mixins: ['Ext.form.field.Field'], > + > + getValue: function() { > + let me = this; > + let snapshots = []; > + > + me.getStore().each((rec) => { > + if (rec.data.include) { > + let store = rec.data.store; > + let snap = rec.data.snapshot; > + snapshots.push(`${store}:${snap}`); > + } > + }); > + > + return snapshots; > + }, > + > + setValue: function(value) { > + let me = this; > + // not implemented > + return me; > + }, > + > + getErrors: function(value) { > + let me = this; > + let firstSelected = me.getStore().findBy((rec) => !!rec.data.include); > + > + if (firstSelected === -1) { > + me.addCls(['x-form-trigger-wrap-default', 'x-form-trigger-wrap-invalid']); > + let errorMsg = gettext("Need at least one snapshot"); > + me.getActionEl().dom.setAttribute('data-errorqtip', errorMsg); > + > + return [errorMsg]; > + } > + me.removeCls(['x-form-trigger-wrap-default', 'x-form-trigger-wrap-invalid']); > + me.getActionEl().dom.setAttribute('data-errorqtip', ""); > + return []; > + }, > + > + scrollable: true, > + height: 200, > + > + viewConfig: { > + emptyText: gettext('No Snapshots'), > + markDirty: false, > + }, > + > + tbar: [ > + { > + fieldLabel: gettext('Filter'), > + xtype: 'textfield', > + isFormField: false, > + listeners: { > + change: function(field, value) { > + let me = this; > + let grid = me.up('grid'); > + let store = grid.getStore(); > + store.clearFilter(); > + store.filter({ > + property: 'snapshot', > + anyMatch: true, > + caseSensitive: true, > + exactMatch: false, > + value, > + }); > + grid.checkChange(); > + }, > + }, > + }, > + ], > + > + store: { data: [] }, > + > + columns: [ > + { > + xtype: 'checkcolumn', > + text: gettext('Include'), > + dataIndex: 'include', > + listeners: { > + checkchange: function(cb, value) { > + let grid = this.up('grid'); > + grid.checkChange(); > + }, > + }, > + }, > + { > + text: gettext('Source Datastore'), > + dataIndex: 'store', > + flex: 1, > + }, > + { > + text: gettext('Snapshot'), > + dataIndex: 'snapshot', > + flex: 4, > + }, > + ], > +}); >