use FileBrowser from proxmox-widget-toolkit

Signed-off-by: Stefan Reiter <s.reiter@proxmox.com>
This commit is contained in:
Stefan Reiter 2021-04-01 17:34:44 +02:00 committed by Thomas Lamprecht
parent 0dfce17a43
commit 3b0321365b
3 changed files with 8 additions and 258 deletions

View File

@ -61,7 +61,6 @@ JSSRC= \
window/BackupGroupChangeOwner.js \
window/CreateDirectory.js \
window/DataStoreEdit.js \
window/FileBrowser.js \
window/NotesEdit.js \
window/RemoteEdit.js \
window/NotifyOptions.js \

View File

@ -452,12 +452,15 @@ Ext.define('PBS.DataStoreContent', {
let type = data['backup-type'];
let timetext = PBS.Utils.render_datetime_utc(data["backup-time"]);
Ext.create('PBS.window.FileBrowser', {
Ext.create('Proxmox.window.FileBrowser', {
title: `${type}/${id}/${timetext}`,
datastore: view.datastore,
'backup-id': id,
'backup-time': (time.getTime()/1000).toFixed(0),
'backup-type': type,
listUrl: `/api2/json/admin/datastore/${view.datastore}/catalog`,
downloadUrl: `/api2/json/admin/datastore/${view.datastore}/pxar-file-download`,
extraParams: {
'backup-id': id,
'backup-time': (time.getTime()/1000).toFixed(0),
'backup-type': type,
},
archive: rec.data.filename,
}).show();
},

View File

@ -1,252 +0,0 @@
Ext.define('pbs-file-tree', {
extend: 'Ext.data.Model',
fields: ['filepath', 'text', 'type', 'size',
{
name: 'mtime',
type: 'date',
dateFormat: 'timestamp',
},
{
name: 'iconCls',
calculate: function(data) {
let icon = 'file-o';
switch (data.type) {
case 'b': // block device
icon = 'cube';
break;
case 'c': // char device
icon = 'tty';
break;
case 'd':
icon = data.expanded ? 'folder-open-o' : 'folder-o';
break;
case 'f': //regular file
icon = 'file-text-o';
break;
case 'h': // hardlink
icon = 'file-o';
break;
case 'l': // softlink
icon = 'link';
break;
case 'p': // pipe/fifo
icon = 'exchange';
break;
case 's': // socket
icon = 'plug';
break;
default:
icon = 'file-o';
break;
}
return `fa fa-${icon}`;
},
},
],
idProperty: 'filepath',
});
Ext.define("PBS.window.FileBrowser", {
extend: "Ext.window.Window",
width: 800,
height: 600,
modal: true,
controller: {
xclass: 'Ext.app.ViewController',
buildUrl: function(baseurl, params) {
let url = new URL(baseurl, window.location.origin);
for (const [key, value] of Object.entries(params)) {
url.searchParams.append(key, value);
}
return url.href;
},
downloadFile: function() {
let me = this;
let view = me.getView();
let tree = me.lookup('tree');
let selection = tree.getSelection();
if (!selection || selection.length < 1) return;
let data = selection[0].data;
let atag = document.createElement('a');
atag.download = data.text;
let params = {
'backup-id': view['backup-id'],
'backup-type': view['backup-type'],
'backup-time': view['backup-time'],
};
params.filepath = data.filepath;
atag.download = data.text;
if (data.type === 'd') {
atag.download += ".zip";
}
atag.href = me
.buildUrl(`/api2/json/admin/datastore/${view.datastore}/pxar-file-download`, params);
atag.click();
},
fileChanged: function() {
let me = this;
let tree = me.lookup('tree');
let selection = tree.getSelection();
if (!selection || selection.length < 1) return;
let data = selection[0].data;
let canDownload = false;
switch (data.type) {
case 'h':
case 'f':
canDownload = true;
break;
case 'd':
if (data.depth > 1) {
canDownload = true;
}
break;
default: break;
}
me.lookup('downloadBtn').setDisabled(!canDownload);
},
init: function(view) {
let me = this;
let tree = me.lookup('tree');
if (!view['backup-id']) {
throw "no backup-id given";
}
if (!view['backup-type']) {
throw "no backup-id given";
}
if (!view['backup-time']) {
throw "no backup-id given";
}
if (!view.datastore) {
throw "no datastore given";
}
let store = tree.getStore();
let proxy = store.getProxy();
Proxmox.Utils.monStoreErrors(tree, store, true);
proxy.setUrl(`/api2/json/admin/datastore/${view.datastore}/catalog`);
proxy.setExtraParams({
'backup-id': view['backup-id'],
'backup-type': view['backup-type'],
'backup-time': view['backup-time'],
});
store.load(() => {
let root = store.getRoot();
root.expand(); // always expand invisible root node
if (view.archive) {
let child = root.findChild('text', view.archive);
if (child) {
child.expand();
setTimeout(function() {
tree.setSelection(child);
tree.getView().focusRow(child);
}, 10);
}
} else if (root.childNodes.length === 1) {
root.firstChild.expand();
}
});
},
control: {
'treepanel': {
selectionchange: 'fileChanged',
},
},
},
layout: 'fit',
items: [
{
xtype: 'treepanel',
scrollable: true,
rootVisible: false,
reference: 'tree',
store: {
autoLoad: false,
model: 'pbs-file-tree',
defaultRootId: '/',
nodeParam: 'filepath',
sorters: 'text',
proxy: {
appendId: false,
type: 'proxmox',
},
},
columns: [
{
text: gettext('Name'),
xtype: 'treecolumn',
flex: 1,
dataIndex: 'text',
renderer: Ext.String.htmlEncode,
},
{
text: gettext('Size'),
dataIndex: 'size',
renderer: value => value === undefined ? '' : Proxmox.Utils.format_size(value),
sorter: {
sorterFn: function(a, b) {
let asize = a.data.size || 0;
let bsize = b.data.size || 0;
return asize - bsize;
},
},
},
{
text: gettext('Modified'),
dataIndex: 'mtime',
minWidth: 200,
},
{
text: gettext('Type'),
dataIndex: 'type',
renderer: function(value) {
switch (value) {
case 'b': return gettext('Block Device');
case 'c': return gettext('Character Device');
case 'd': return gettext('Directory');
case 'f': return gettext('File');
case 'h': return gettext('Hardlink');
case 'l': return gettext('Softlink');
case 'p': return gettext('Pipe/Fifo');
case 's': return gettext('Socket');
default: return Proxmox.Utils.unknownText;
}
},
},
],
},
],
buttons: [
{
text: gettext('Download'),
handler: 'downloadFile',
reference: 'downloadBtn',
disabled: true,
},
],
});