luci-mod-network: slightly improve static lease config

 - Autoselect the matching IPv4 address when initially picking a MAC
 - Add hostname hints in the MAC/IP dropdowns

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

diff --git a/modules/luci-mod-network/htdocs/luci-static/resources/view/network/dhcp.js b/modules/luci-mod-network/htdocs/luci-static/resources/view/network/dhcp.js
index 1e9c402e0c1f93e1c6424d7aac8e39599178dcf6..3acb6d1a16864b73aeac1078569dbd4b9bf2bc95 100644 (file)
--- a/modules/luci-mod-network/htdocs/luci-static/resources/view/network/dhcp.js
+++ b/modules/luci-mod-network/htdocs/luci-static/resources/view/network/dhcp.js
@@ -345,8 +345,29 @@ return L.view.extend({
 
                        return result.length ? result.join(' ') : null;
                };
+               so.renderWidget = function(section_id, option_index, cfgvalue) {
+                       var node = form.Value.prototype.renderWidget.apply(this, [section_id, option_index, cfgvalue]),
+                           ipopt = this.section.children.filter(function(o) { return o.option == 'ip' })[0];
+
+                       node.addEventListener('cbi-dropdown-change', L.bind(function(ipopt, section_id, ev) {
+                               var mac = ev.detail.value.value;
+                               if (mac == null || mac == '' || !hosts[mac] || !hosts[mac].ipv4)
+                                       return;
+
+                               var ip = ipopt.formvalue(section_id);
+                               if (ip != null && ip != '')
+                                       return;
+
+                               var node = ipopt.map.findElement('id', ipopt.cbid(section_id));
+                               if (node)
+                                       L.dom.callClassMethod(node, 'setValue', hosts[mac].ipv4);
+                       }, this, ipopt, section_id));
+
+                       return node;
+               };
                Object.keys(hosts).forEach(function(mac) {
-                       so.value(mac);
+                       var hint = hosts[mac].name || hosts[mac].ipv4;
+                       so.value(mac, hint ? '%s (%s)'.format(mac, hint) : mac);
                });
 
                so = ss.option(form.Value, 'ip', _('<abbr title="Internet Protocol Version 4">IPv4</abbr>-Address'));
@@ -363,8 +384,10 @@ return L.view.extend({
                        return true;
                };
                Object.keys(hosts).forEach(function(mac) {
-                       if (hosts[mac].ipv4)
-                               so.value(hosts[mac].ipv4);
+                       if (hosts[mac].ipv4) {
+                               var hint = hosts[mac].name;
+                               so.value(hosts[mac].ipv4, hint ? '%s (%s)'.format(hosts[mac].ipv4, hint) : hosts[mac].ipv4);
+                       }
                });
 
                so = ss.option(form.Value, 'leasetime', _('Lease time'));