From: Dominik Csapak <d.csapak@proxmox.com>
To: pbs-devel@lists.proxmox.com
Subject: [pbs-devel] [PATCH proxmox-backup v2 05/15] ui: tape: add form fields
Date: Thu, 28 Jan 2021 12:59:45 +0100 [thread overview]
Message-ID: <20210128115955.23136-6-d.csapak@proxmox.com> (raw)
In-Reply-To: <20210128115955.23136-1-d.csapak@proxmox.com>
this includes selectors for
* Allocation Policy
* Retention Policy
* Drives
* Changers
* Tape Device Paths
* Pools
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
www/Makefile | 6 +++
www/tape/form/AllocationSelector.js | 31 ++++++++++++
www/tape/form/ChangerSelector.js | 60 ++++++++++++++++++++++
www/tape/form/DriveSelector.js | 66 +++++++++++++++++++++++++
www/tape/form/PoolSelector.js | 44 +++++++++++++++++
www/tape/form/RetentionSelector.js | 26 ++++++++++
www/tape/form/TapeDevicePathSelector.js | 62 +++++++++++++++++++++++
7 files changed, 295 insertions(+)
create mode 100644 www/tape/form/AllocationSelector.js
create mode 100644 www/tape/form/ChangerSelector.js
create mode 100644 www/tape/form/DriveSelector.js
create mode 100644 www/tape/form/PoolSelector.js
create mode 100644 www/tape/form/RetentionSelector.js
create mode 100644 www/tape/form/TapeDevicePathSelector.js
diff --git a/www/Makefile b/www/Makefile
index c2d80c74..beea80bf 100644
--- a/www/Makefile
+++ b/www/Makefile
@@ -9,6 +9,12 @@ TAPE_UI_FILES=
ifdef TEST_TAPE_GUI
TAPE_UI_FILES= \
+ tape/form/AllocationSelector.js \
+ tape/form/ChangerSelector.js \
+ tape/form/DriveSelector.js \
+ tape/form/PoolSelector.js \
+ tape/form/RetentionSelector.js \
+ tape/form/TapeDevicePathSelector.js \
TapeManagement.js
endif
diff --git a/www/tape/form/AllocationSelector.js b/www/tape/form/AllocationSelector.js
new file mode 100644
index 00000000..ab56c00c
--- /dev/null
+++ b/www/tape/form/AllocationSelector.js
@@ -0,0 +1,31 @@
+Ext.define('PBS.TapeManagement.AllocationStore', {
+ extend: 'Ext.data.Store',
+ alias: 'store.allocationCalendarEventStore',
+
+ field: ['value', 'text'],
+ data: [
+ { value: 'continue', text: gettext('Continue') },
+ { value: 'always', text: gettext('Always') },
+ { value: '*:0/30', text: Ext.String.format(gettext("Every {0} minutes"), 30) },
+ { value: 'hourly', text: gettext("Every hour") },
+ { value: '0/2:00', text: gettext("Every two hours") },
+ { value: '2,22:30', text: gettext("Every day") + " 02:30, 22:30" },
+ { value: 'daily', text: gettext("Every day") + " 00:00" },
+ { value: 'mon..fri', text: gettext("Monday to Friday") + " 00:00" },
+ { value: 'mon..fri *:00', text: gettext("Monday to Friday") + ', ' + gettext("hourly") },
+ { value: 'sat 18:15', text: gettext("Every Saturday") + " 18:15" },
+ { value: 'monthly', text: gettext("Every first day of the Month") + " 00:00" },
+ { value: 'sat *-1..7 02:00', text: gettext("Every first Saturday of the month") + " 02:00" },
+ { value: 'yearly', text: gettext("First day of the year") + " 00:00" },
+ ],
+});
+
+Ext.define('PBS.TapeManagement.AllocationSelector', {
+ extend: 'PBS.form.CalendarEvent',
+ alias: 'widget.pbsAllocationSelector',
+
+ store: {
+ type: 'allocationCalendarEventStore',
+ },
+});
+
diff --git a/www/tape/form/ChangerSelector.js b/www/tape/form/ChangerSelector.js
new file mode 100644
index 00000000..cc07580c
--- /dev/null
+++ b/www/tape/form/ChangerSelector.js
@@ -0,0 +1,60 @@
+Ext.define('PBS.form.ChangerSelector', {
+ extend: 'Proxmox.form.ComboGrid',
+ alias: 'widget.pbsChangerSelector',
+
+ allowBlank: false,
+ displayField: 'name',
+ valueField: 'name',
+ value: null,
+ multiSelect: false,
+
+
+ store: {
+ proxy: {
+ type: 'proxmox',
+ url: '/api2/json/tape/changer',
+ },
+ autoLoad: true,
+ sorter: 'name',
+ },
+
+ listConfig: {
+ columns: [
+ {
+ text: gettext('Name'),
+ dataIndex: 'name',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Path'),
+ sortable: true,
+ dataIndex: 'path',
+ hidden: true,
+ flex: 1,
+ },
+ {
+ text: gettext('Vendor'),
+ dataIndex: 'vendor',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Model'),
+ dataIndex: 'model',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Serial'),
+ dataIndex: 'serial',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ ],
+ },
+});
diff --git a/www/tape/form/DriveSelector.js b/www/tape/form/DriveSelector.js
new file mode 100644
index 00000000..333989a9
--- /dev/null
+++ b/www/tape/form/DriveSelector.js
@@ -0,0 +1,66 @@
+Ext.define('PBS.form.DriveSelector', {
+ extend: 'Proxmox.form.ComboGrid',
+ alias: 'widget.pbsDriveSelector',
+
+ allowBlank: false,
+ displayField: 'name',
+ valueField: 'name',
+ value: null,
+
+ store: {
+ proxy: {
+ type: 'proxmox',
+ url: '/api2/json/tape/drive',
+ },
+ autoLoad: true,
+ sorters: 'name',
+ },
+
+ listConfig: {
+ columns: [
+ {
+ text: gettext('Name'),
+ dataIndex: 'name',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Vendor'),
+ dataIndex: 'vendor',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Model'),
+ dataIndex: 'model',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Serial'),
+ dataIndex: 'serial',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ ],
+ },
+
+ initComponent: function() {
+ let me = this;
+
+ if (me.changer) {
+ me.store.proxy.extraParams = {
+ changer: me.changer,
+ };
+ } else {
+ me.store.proxy.extraParams = {};
+ }
+
+ me.callParent();
+ },
+});
+
diff --git a/www/tape/form/PoolSelector.js b/www/tape/form/PoolSelector.js
new file mode 100644
index 00000000..2a0f0bbb
--- /dev/null
+++ b/www/tape/form/PoolSelector.js
@@ -0,0 +1,44 @@
+Ext.define('PBS.TapeManagement.PoolSelector', {
+ extend: 'Proxmox.form.ComboGrid',
+ alias: 'widget.pbsMediaPoolSelector',
+
+ allowBlank: false,
+ displayField: 'name',
+ valueField: 'name',
+ autoSelect: false,
+
+ store: {
+ proxy: {
+ type: 'proxmox',
+ url: '/api2/json/config/media-pool',
+ },
+ autoLoad: true,
+ sorters: 'name',
+ },
+
+ listConfig: {
+ columns: [
+ {
+ text: gettext('Name'),
+ dataIndex: 'name',
+ },
+ {
+ text: gettext('Drive'),
+ dataIndex: 'drive',
+ },
+ {
+ text: gettext('Allocation'),
+ dataIndex: 'allocation',
+ },
+ {
+ text: gettext('Retention'),
+ dataIndex: 'retention',
+ },
+ {
+ text: gettext('Encryption Fingerprint'),
+ dataIndex: 'encryption',
+ },
+ ],
+ },
+});
+
diff --git a/www/tape/form/RetentionSelector.js b/www/tape/form/RetentionSelector.js
new file mode 100644
index 00000000..4c77d39e
--- /dev/null
+++ b/www/tape/form/RetentionSelector.js
@@ -0,0 +1,26 @@
+Ext.define('PBS.TapeManagement.RetentionStore', {
+ extend: 'Ext.data.Store',
+ alias: 'store.retentionCalendarEventStore',
+
+ field: ['value', 'text'],
+ data: [
+ { value: 'overwrite', text: gettext('Overwrite') },
+ { value: 'keep', text: gettext('Keep') },
+ { value: '120 minutes', text: Ext.String.format(gettext("{0} minutes"), 120) },
+ { value: '12 hours', text: Ext.String.format(gettext("{0} hours"), 12) },
+ { value: '7 days', text: Ext.String.format(gettext("{0} days"), 7) },
+ { value: '4 weeks', text: Ext.String.format(gettext("{0} weeks"), 4) },
+ { value: '6 months', text: Ext.String.format(gettext("{0} months"), 6) },
+ { value: '2 years', text: Ext.String.format(gettext("{0} years"), 2) },
+ ],
+});
+
+Ext.define('PBS.TapeManagement.RetentionSelector', {
+ extend: 'PBS.form.CalendarEvent',
+ alias: 'widget.pbsRetentionSelector',
+
+ store: {
+ type: 'retentionCalendarEventStore',
+ },
+});
+
diff --git a/www/tape/form/TapeDevicePathSelector.js b/www/tape/form/TapeDevicePathSelector.js
new file mode 100644
index 00000000..e458454d
--- /dev/null
+++ b/www/tape/form/TapeDevicePathSelector.js
@@ -0,0 +1,62 @@
+Ext.define('PBS.form.TapeDevicePathSelector', {
+ extend: 'Proxmox.form.ComboGrid',
+ alias: 'widget.pbsTapeDevicePathSelector',
+
+ allowBlank: false,
+ displayField: 'path',
+ valueField: 'path',
+
+ // type can be 'drives' or 'changers'
+ type: 'drives',
+
+ listConfig: {
+ columns: [
+ {
+ text: gettext('Path'),
+ dataIndex: 'path',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Vendor'),
+ dataIndex: 'vendor',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Model'),
+ dataIndex: 'model',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ {
+ text: gettext('Serial'),
+ dataIndex: 'serial',
+ sortable: true,
+ flex: 1,
+ renderer: Ext.String.htmlEncode,
+ },
+ ],
+ },
+
+ initComponent: function() {
+ let me = this;
+ if (me.type !== 'drives' && me.type !== 'changers') {
+ throw `invalid type '${me.type}'`;
+ }
+
+ let url = `/api2/json/tape/scan-${me.type}`;
+ me.store = {
+ proxy: {
+ type: 'proxmox',
+ url,
+ },
+ autoLoad: true,
+ };
+
+ me.callParent();
+ },
+});
--
2.20.1
next prev parent reply other threads:[~2021-01-28 12:00 UTC|newest]
Thread overview: 17+ messages / expand[flat|nested] mbox.gz Atom feed top
2021-01-28 11:59 [pbs-devel] [PATCH proxmox-backup v2 00/15] implement first version of tape gui Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 01/15] api2/tape/changer: add changer filter to list_drives api call Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 02/15] api2/tape/drive: add load_media as " Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 03/15] api2/tape/drive: change methods of some api calls from put to get Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 04/15] api2/config/{drive, changer}: prevent adding same device multiple times Dominik Csapak
2021-01-28 11:59 ` Dominik Csapak [this message]
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 06/15] ui: tape: add Edit Windows Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 07/15] ui: tape: add BackupOverview Panel Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 08/15] ui: tape: add ChangerStatus panel Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 09/15] ui: tape: add DriveConfig panel Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 10/15] ui: tape: add PoolConfig Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 11/15] ui: tape: move TapeManagement.js to tape dir Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 12/15] ui: tape: use panels in tape interface Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 13/15] tape/changer: add vendor/model to DriveStatus Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 14/15] tape/changer: refactor marking of import/export slots from config Dominik Csapak
2021-01-28 11:59 ` [pbs-devel] [PATCH proxmox-backup v2 15/15] tape: change changer-drive-id to changer-drivenum Dominik Csapak
2021-01-28 14:13 ` [pbs-devel] [PATCH proxmox-backup v2 00/15] implement first version of tape gui Dietmar Maurer
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
--in-reply-to=20210128115955.23136-6-d.csapak@proxmox.com \
--to=d.csapak@proxmox.com \
--cc=pbs-devel@lists.proxmox.com \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox