proxmox-widget-toolkit/form/NetworkSelector.js

Ext.define('Proxmox.form.NetworkSelectorController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.proxmoxNetworkSelectorController',

    init: function(view) {
	let me = this;

	if (!view.nodename) {
	    throw "missing custom view config: nodename";
	}
	view.getStore().getProxy().setUrl('/api2/json/nodes/'+ view.nodename + '/network');
    },
});

Ext.define('Proxmox.data.NetworkSelector', {
    extend: 'Ext.data.Model',
    fields: [
	{ name: 'active' },
	{ name: 'cidr' },
	{ name: 'cidr6' },
	{ name: 'address' },
	{ name: 'address6' },
	{ name: 'comments' },
	{ name: 'iface' },
	{ name: 'slaves' },
	{ name: 'type' },
    ],
});

Ext.define('Proxmox.form.NetworkSelector', {
    extend: 'Proxmox.form.ComboGrid',
    alias: 'widget.proxmoxNetworkSelector',

    controller: 'proxmoxNetworkSelectorController',

    nodename: 'localhost',
    setNodename: function(nodename) {
	this.nodename = nodename;
	let networkSelectorStore = this.getStore();
	networkSelectorStore.removeAll();
	// because of manual local copy of data for ip4/6
	this.getPicker().refresh();
	if (networkSelectorStore && typeof networkSelectorStore.getProxy === 'function') {
	    networkSelectorStore.getProxy().setUrl('/api2/json/nodes/'+ nodename + '/network');
	    networkSelectorStore.load();
	}
    },
    // set default value to empty array, else it inits it with
    // null and after the store load it is an empty array,
    // triggering dirtychange
    value: [],
    valueField: 'cidr',
    displayField: 'cidr',
    store: {
	autoLoad: true,
	model: 'Proxmox.data.NetworkSelector',
	proxy: {
	    type: 'proxmox',
	},
	sorters: [
	    {
		property: 'iface',
		direction: 'ASC',
	    },
	],
	filters: [
	    function(item) {
		return item.data.cidr;
	    },
	],
	listeners: {
	    load: function(store, records, successfull) {
		if (successfull) {
		    records.forEach(function(record) {
			if (record.data.cidr6) {
			    let dest = record.data.cidr ? record.copy(null) : record;
			    dest.data.cidr = record.data.cidr6;
			    dest.data.address = record.data.address6;
			    delete record.data.cidr6;
			    dest.data.comments = record.data.comments6;
			    delete record.data.comments6;
			    store.add(dest);
			}
		    });
		}
	    },
	},
    },
    listConfig: {
	width: 600,
	columns: [
	    {

		header: gettext('CIDR'),
		dataIndex: 'cidr',
		hideable: false,
		flex: 1,
	    },
	    {

		header: gettext('IP'),
		dataIndex: 'address',
		hidden: true,
	    },
	    {
		header: gettext('Interface'),
		width: 90,
		dataIndex: 'iface',
	    },
	    {
		header: gettext('Active'),
		renderer: Proxmox.Utils.format_boolean,
		width: 60,
		dataIndex: 'active',
	    },
	    {
		header: gettext('Type'),
		width: 80,
		hidden: true,
		dataIndex: 'type',
	    },
	    {
		header: gettext('Comment'),
		flex: 2,
		dataIndex: 'comments',
	    },
	],
    },
});