pve-manager/www/manager6/sdn/SubnetView.js

Ext.define('PVE.sdn.SubnetView', {
    extend: 'Ext.grid.GridPanel',
    alias: 'widget.pveSDNSubnetView',

    stateful: true,
    stateId: 'grid-sdn-subnet',

    base_url: undefined,

    remove_btn: undefined,

    setBaseUrl: function(url) {
	let me = this;

	me.base_url = url;

	if (url === undefined) {
	    me.store.removeAll();
	    me.create_btn.disable();
	} else {
	    me.remove_btn.baseurl = url + '/';
	    me.store.setProxy({
		type: 'proxmox',
		url: '/api2/json/' + url + '?pending=1',
	    });
	    me.create_btn.enable();
	    me.store.load();
	}
    },

    initComponent: function() {
	let me = this;

	let store = new Ext.data.Store({
	    model: 'pve-sdn-subnet',
	});

	let reload = function() {
	    store.load();
	};

	let sm = Ext.create('Ext.selection.RowModel', {});

        let run_editor = function() {
	    let rec = sm.getSelection()[0];

	    let win = Ext.create('PVE.sdn.SubnetEdit', {
		autoShow: true,
		subnet: rec.data.subnet,
		base_url: me.base_url,
	    });
	    win.on('destroy', reload);
        };

	me.create_btn = new Proxmox.button.Button({
	    text: gettext('Create'),
	    disabled: true,
	    handler: function() {
		let win = Ext.create('PVE.sdn.SubnetEdit', {
		    autoShow: true,
		    base_url: me.base_url,
		    type: 'subnet',
		});
		win.on('destroy', reload);
	    },
	});

	let edit_btn = new Proxmox.button.Button({
	    text: gettext('Edit'),
	    disabled: true,
	    selModel: sm,
	    handler: run_editor,
	});

	me.remove_btn = Ext.create('Proxmox.button.StdRemoveButton', {
	    selModel: sm,
	    baseurl: me.base_url + '/',
	    callback: () => store.load(),
	});

	let set_button_status = function() {
	    var rec = me.selModel.getSelection()[0];

	    if (!rec || rec.data.state === 'deleted') {
		edit_btn.disable();
		me.remove_btn.disable();
	    }
	};

	Ext.apply(me, {
	    store: store,
	    reloadStore: reload,
	    selModel: sm,
	    viewConfig: {
		trackOver: false,
	    },
	    tbar: [
		me.create_btn,
		me.remove_btn,
		edit_btn,
	    ],
	    columns: [
		{
		    header: gettext('Subnet'),
		    flex: 2,
		    dataIndex: 'cidr',
		    renderer: function(value, metaData, rec) {
			return PVE.Utils.render_sdn_pending(rec, value, 'cidr', 1);
		    },
		},
		{
		    header: gettext('Gateway'),
		    flex: 1,
		    dataIndex: 'gateway',
		    renderer: function(value, metaData, rec) {
			return PVE.Utils.render_sdn_pending(rec, value, 'gateway');
		    },
		},
		{
		    header: 'SNAT',
		    flex: 1,
		    dataIndex: 'snat',
		    renderer: function(value, metaData, rec) {
			return PVE.Utils.render_sdn_pending(rec, value, 'snat');
		    },
		},
		{
		    header: gettext('DNS Prefix'),
		    flex: 1,
		    dataIndex: 'dnszoneprefix',
                    renderer: function(value, metaData, rec) {
                        return PVE.Utils.render_sdn_pending(rec, value, 'dnszoneprefix');
		    },
                },
		{
		    header: gettext('State'),
		    width: 100,
		    dataIndex: 'state',
		    renderer: function(value, metaData, rec) {
			return PVE.Utils.render_sdn_pending_state(rec, value);
		    },
		},

	    ],
	    listeners: {
		activate: reload,
		itemdblclick: run_editor,
		selectionchange: set_button_status,
	    },
	});

	me.callParent();

        if (me.base_url) {
            me.setBaseUrl(me.base_url); // load
        }
    },
}, function() {
    Ext.define('pve-sdn-subnet', {
	extend: 'Ext.data.Model',
	fields: [
	    'cidr',
	    'gateway',
	    'snat',
	],
	idProperty: 'subnet',
    });
});