proxmox-mirrors/pve-manager
1
0
Fork 0
mirror of https://git.proxmox.com/git/pve-manager synced 2025-08-09 10:14:46 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

ui: tags: implement dirty tracking for inline editing

Browse Source 
similar to how regular forms are tracked

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
Dominik Csapak 2022-11-18 12:59:17 +01:00 committed by Thomas Lamprecht
parent e83ea30e4a
commit 66dace4b3c
1 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
www/manager6/form/TagEdit.js
View File

@ -30,12 +30,12 @@ Ext.define('PVE.panel.TagEditContainer', {
newtags.forEach((tag) => { newtags.forEach((tag) => {
me.addTag(tag); me.addTag(tag);
}); });
me.updateFilter();
view.suspendLayout = false; view.suspendLayout = false;
view.updateLayout(); view.updateLayout();
if (!force) { if (!force) {
me.oldTags = tagstring; me.oldTags = tagstring;
} }
me.tagsChanged();
}, },
onRender: function(v) { onRender: function(v) {
@ -116,6 +116,7 @@ Ext.define('PVE.panel.TagEditContainer', {
let targetCmp = Ext.getCmp(target.id); let targetCmp = Ext.getCmp(target.id);
view.remove(sourceCmp, { destroy: false }); view.remove(sourceCmp, { destroy: false });
view.insert(view.items.indexOf(targetCmp), sourceCmp); view.insert(view.items.indexOf(targetCmp), sourceCmp);
me.tagsChanged();
}, },
}); });
}, },
@ -172,7 +173,7 @@ Ext.define('PVE.panel.TagEditContainer', {
me.getView().updateLayout(); me.getView().updateLayout();
}, },
updateFilter: function() { tagsChanged: function() {
let me = this; let me = this;
let tags = []; let tags = [];
me.forEachTag(cmp => { me.forEachTag(cmp => {
@ -180,6 +181,7 @@ Ext.define('PVE.panel.TagEditContainer', {
tags.push(cmp.tag); tags.push(cmp.tag);
} }
}); });
me.getViewModel().set('isDirty', me.oldTags !== tags.join(','));
me.forEachTag(cmp => { me.forEachTag(cmp => {
cmp.updateFilter(tags); cmp.updateFilter(tags);
}); });
@ -208,11 +210,10 @@ Ext.define('PVE.panel.TagEditContainer', {
tag, tag,
mode: vm.get('editMode') ? 'editable' : 'normal', mode: vm.get('editMode') ? 'editable' : 'normal',
listeners: { listeners: {
change: (field, newTag) => { change: 'tagsChanged',
me.updateFilter();
},
destroy: function() { destroy: function() {
vm.set('tagCount', vm.get('tagCount') - 1); vm.set('tagCount', vm.get('tagCount') - 1);
me.tagsChanged();
}, },
keypress: function(key) { keypress: function(key) {
if (key === 'Enter') { if (key === 'Enter') {
@ -225,7 +226,7 @@ Ext.define('PVE.panel.TagEditContainer', {
}); });
if (isNew) { if (isNew) {
me.updateFilter(); me.tagsChanged();
tagField.selectText(); tagField.selectText();
} }
@ -265,6 +266,7 @@ Ext.define('PVE.panel.TagEditContainer', {
tagCount: 0, tagCount: 0,
editMode: false, editMode: false,
canEdit: true, canEdit: true,
isDirty: false,
}, },
formulas: { formulas: {
@ -331,6 +333,7 @@ Ext.define('PVE.panel.TagEditContainer', {
tooltip: gettext('Finish Edit'), tooltip: gettext('Finish Edit'),
bind: { bind: {
hidden: '{!editMode}', hidden: '{!editMode}',
disabled: '{!isDirty}',
}, },
hidden: true, hidden: true,
ui: 'default-toolbar', ui: 'default-toolbar',