and exclude the tags for that, since we want the tags to have their own
tooltips
Signed-off-by: Dominik Csapak <d.csa...@proxmox.com>
---
not really sure if we want to do this, since creating a custom tree
column type just for that seems overkill. also we have to touch private
properties of that here to change it which i don't really like
www/manager6/tree/ResourceTree.js | 87 ++++++++++++++++++++++++++++---
1 file changed, 80 insertions(+), 7 deletions(-)
diff --git a/www/manager6/tree/ResourceTree.js
b/www/manager6/tree/ResourceTree.js
index 54c6403d..f23f9f99 100644
--- a/www/manager6/tree/ResourceTree.js
+++ b/www/manager6/tree/ResourceTree.js
@@ -103,10 +103,15 @@ Ext.define('PVE.tree.ResourceTree', {
},
setIconCls: function(info) {
+ let me = this;
let cls = PVE.Utils.get_object_icon_class(info.type, info);
if (cls !== '') {
info.iconCls = cls;
}
+ let tip = me.getToolTip(info);
+ if (tip) {
+ info.iconAttrs = `data-qtip="${tip}"`;
+ }
},
// add additional elements to text. Currently only the usage indicator for
storages
@@ -130,15 +135,22 @@ Ext.define('PVE.tree.ResourceTree', {
info.text = `${info.name} (${String(info.vmid)})`;
}
}
+ info.text = status + info.text;
- info.text += PVE.Utils.renderTags(info.tags,
PVE.UIOptions.tagOverrides);
+ let tip = me.getToolTip(info);
+ if (tip) {
+ info.text = `<span data-qtip="${tip}">${info.text}</span>`;
+ }
- info.text = status + info.text;
+ info.text += PVE.Utils.renderTags(info.tags,
PVE.UIOptions.tagOverrides);
},
- setToolTip: function(info) {
+ getToolTip: function(info) {
+ if (info.tip) {
+ return info.tip;
+ }
if (info.type === 'pool' || info.groupbyid !== undefined) {
- return;
+ return undefined;
}
let qtips = [gettext('Status') + ': ' + (info.qmpstatus ||
info.status)];
@@ -149,7 +161,9 @@ Ext.define('PVE.tree.ResourceTree', {
qtips.push(gettext('HA State') + ": " + info.hastate);
}
- info.qtip = qtips.join(', ');
+ let tip = qtips.join(', ');
+ info.tip = tip;
+ return tip;
},
// private
@@ -158,7 +172,6 @@ Ext.define('PVE.tree.ResourceTree', {
me.setIconCls(info);
me.setText(info);
- me.setToolTip(info);
if (info.groupbyid) {
info.text = info.groupbyid;
@@ -315,7 +328,6 @@ Ext.define('PVE.tree.ResourceTree', {
Ext.apply(info, item.data);
me.setIconCls(info);
me.setText(info);
- me.setToolTip(info);
olditem.commit();
}
if ((!item || moved) && olditem.isLeaf()) {
@@ -471,4 +483,65 @@ Ext.define('PVE.tree.ResourceTree', {
rstore.startUpdate();
},
+ hideHeaders: true,
+
+ columns: [
+ {
+ xtype: 'pveResourceTreeColumn',
+ text: 'Name',
+ flex: 1,
+ dataIndex: 'text',
+ },
+ ],
+
+});
+
+// we want to change how the icon div is rendered, so we have to subclass
+// the whole tree column class to change the cellTpl and available data
+Ext.define('PVE.tree.ResourceTreeColumn', {
+ extend: 'Ext.tree.Column',
+ alias: 'widget.pveResourceTreeColumn',
+
+ // copied from Ext.tree.Column source except indentation and one detail
(see inline comment)
+ cellTpl: [
+ '<tpl for="lines">',
+ '<div class="{parent.childCls} {parent.elbowCls}-img ',
+ '{parent.elbowCls}-<tpl if=".">line<tpl else>empty</tpl>"
role="presentation"></div>',
+ '</tpl>',
+ '<div class="{childCls} {elbowCls}-img {elbowCls}',
+ '<tpl if="isLast">-end</tpl><tpl if="expandable">-plus
{expanderCls}</tpl>" role="presentation"></div>',
+ '<tpl if="checked !== null">',
+ '<div role="button" {ariaCellCheckboxAttr}',
+ ' class="{childCls} {checkboxCls}<tpl if="checked">
{checkboxCls}-checked</tpl>"></div>',
+ '</tpl>',
+ '<tpl if="glyph">',
+ '<span class="{baseIconCls}" ',
+ '<tpl if="glyphFontFamily">',
+ 'style="font-family:{glyphFontFamily}"',
+ '</tpl>',
+ '>{glyph}</span>',
+ '<tpl else>',
+ '<tpl if="icon">',
+ '<img src="{blankUrl}"',
+ '<tpl else>',
+ '<div',
+ '</tpl>',
+ ' role="presentation" class="{childCls} {baseIconCls}
{customIconCls} ',
+ '{baseIconCls}-<tpl if="leaf">leaf<tpl else><tpl
if="expanded">parent-expanded<tpl else>parent</tpl></tpl> {iconCls}" ',
+ // the line below has 'iconAttrs' added to it
+ '<tpl if="icon">style="background-image:url({icon})"/><tpl
else>{iconAttrs}></div></tpl>',
+ '</tpl>',
+ '<tpl if="href">',
+ '<a href="{href}" role="link" target="{hrefTarget}"
class="{textCls} {childCls}">{value}</a>',
+ '<tpl else>',
+ '<span class="{textCls} {childCls}">{value}</span>',
+ '</tpl>',
+ ],
+
+ initTemplateRendererData: function(value, metaData, record, rowIdx,
colIdx, store, view) {
+ let me = this;
+ let data = me.callParent(arguments);
+ data.iconAttrs = record.data.iconAttrs ?? '';
+ return data;
+ },
});
--
2.30.2
_______________________________________________
pve-devel mailing list
pve-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel
