将 luci-app-tailscale 添加到 immortalwrt/luci

applications/luci-app-tailscale/Makefile

@@ -0,0 +1,19 @@
+# SPDX-License-Identifier: GPL-3.0-only
+#
+# Copyright (C) 2024 asvow
+
+include $(TOPDIR)/rules.mk
+
+LUCI_TITLE:=LuCI for Tailscale
+LUCI_DEPENDS:=+tailscale
+LUCI_PKGARCH:=all
+
+PKG_VERSION:=1.2.2
+
+define Package/luci-app-tailscale/conffiles
+/etc/config/tailscale
+endef
+
+include $(TOPDIR)/feeds/luci/luci.mk
+
+# call BuildPackage - OpenWrt buildroot signature

applications/luci-app-tailscale/htdocs/luci-static/resources/view/tailscale/interface.js

@@ -0,0 +1,135 @@
+/* SPDX-License-Identifier: GPL-3.0-only
+ *
+ * Copyright (C) 2022 ImmortalWrt.org
+ * Copyright (C) 2024 asvow
+ */
+
+'use strict';
+'require dom';
+'require fs';
+'require poll';
+'require ui';
+'require view';
+
+return view.extend({
+	load: function() {
+		return fs.exec('/sbin/ifconfig').then(function(res) {
+			if (res.code !== 0 || !res.stdout || res.stdout.trim() === '') {
+				ui.addNotification(null, E('p', {}, _('Unable to get interface info: %s.').format(res.message)));
+				return '';
+			}
+
+			var interfaces = res.stdout.match(/tailscale[0-9]+/g);
+			if (!interfaces || interfaces.length === 0)
+				return 'No interface online.';
+
+			var promises = interfaces.map(function(name) {
+				return fs.exec('/sbin/ifconfig', [name]);
+			});
+
+			return Promise.all(promises).then(function(results) {
+				var data = results.map(function(res, index) {
+					if (res.code !== 0 || !res.stdout || res.stdout.trim() === '') {
+						ui.addNotification(null, E('p', {}, _('Unable to get interface %s info: %s.').format(interfaces[index], res.message)));
+						return null;
+					}
+					return {
+						name: interfaces[index],
+						stdout: res.stdout.trim()
+					};
+				}).filter(Boolean);
+
+				return data.map(function(info) {
+					var lines = info.stdout.split('\n');
+					var parsedInfo = {
+						name: info.name
+					};
+
+					lines.forEach(function(line) {
+						if (line.includes('inet addr:')) {
+							parsedInfo.ipv4 = line.split('inet addr:')[1].trim().split(' ')[0];
+						} else if (line.includes('inet6 addr:')) {
+							parsedInfo.ipv6 = line.split('inet6 addr:')[1].trim().split('/')[0];
+						} else if (line.includes('MTU:')) {
+							parsedInfo.mtu = line.split('MTU:')[1].trim().split(' ')[0];
+						} else if (line.includes('RX bytes:')) {
+							var rxMatch = line.match(/RX bytes:\d+ \(([\d.]+\s*[a-zA-Z]+)\)/);
+							if (rxMatch && rxMatch[1]) {
+								parsedInfo.rxBytes = rxMatch[1];
+							}
+							var txMatch = line.match(/TX bytes:\d+ \(([\d.]+\s*[a-zA-Z]+)\)/);
+							if (txMatch && txMatch[1]) {
+								parsedInfo.txBytes = txMatch[1];
+							}
+						}
+					});
+
+					return parsedInfo;
+				});
+			});
+		});
+	},
+
+	pollData: function (container) {
+		poll.add(L.bind(function () {
+			return this.load().then(L.bind(function (data) {
+				dom.content(container, this.renderContent(data));
+			}, this));
+		}, this));
+	},
+
+	renderContent: function (data) {
+		if (!Array.isArray(data)) {
+			return E('div', {}, _('No interface online.'));
+		}
+		var rows = data.flatMap(function(interfaceData) {
+			return [
+				E('th', {class: 'th', colspan: '2'}, _('Network Interface Information')),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('Interface Name')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.name)
+				]),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('IPv4 Address')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.ipv4)
+				]),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('IPv6 Address')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.ipv6)
+				]),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('MTU')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.mtu)
+				]),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('Total Download')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.rxBytes)
+				]),
+				E('tr', {class: 'tr'}, [
+					E('td', {class: 'td left', width: '25%'}, _('Total Upload')),
+					E('td', {class: 'td left', width: '25%'}, interfaceData.txBytes)
+				])
+			];
+		});
+
+		return E('table', { 'class': 'table' }, rows);
+	},
+
+	render: function(data) {
+		var content = E([], [
+			E('h2', {class: 'content'}, _('Tailscale')),
+			E('div', {class: 'cbi-map-descr'}, _('Tailscale is a cross-platform and easy to use virtual LAN.')),
+			E('div')
+		]);
+		var container = content.lastElementChild;
+
+		dom.content(container, this.renderContent(data));
+		this.pollData(container);
+
+		return content;
+	},
+
+	handleSaveApply: null,
+	handleSave: null,
+	handleReset: null
+});

applications/luci-app-tailscale/htdocs/luci-static/resources/view/tailscale/log.js

@@ -0,0 +1,93 @@
+'use strict';
+'require fs';
+'require poll';
+'require ui';
+'require view';
+
+return view.extend({
+	retrieveLog: async function() {
+		return Promise.all([
+			L.resolveDefault(fs.stat('/sbin/logread'), null),
+			L.resolveDefault(fs.stat('/usr/sbin/logread'), null)
+		]).then(function(stat) {
+			var logger = stat[0] ? stat[0].path : stat[1] ? stat[1].path : null;
+
+			return fs.exec_direct(logger, [ '-e', 'tailscale' ]).then(logdata => {
+				var statusMappings = {
+					'daemon.err': { status: 'StdErr', startIndex: 9 },
+					'daemon.notice': { status: 'Info', startIndex: 10 }
+				};
+				const loglines = logdata.trim().split(/\n/).map(function(log) {
+					var logParts = log.split(' ').filter(Boolean);
+					if (logParts.length >= 6) {
+						var formattedTime = logParts[1] + ' ' + logParts[2] + ' - ' + logParts[3];
+						var status = logParts[5];
+						var mapping = statusMappings[status] || { status: status, startIndex: 9 };
+						status = mapping.status;
+						var startIndex = mapping.startIndex;
+						var message = logParts.slice(startIndex).join(' ');
+						return formattedTime + ' [ ' + status + ' ] - ' + message;
+					} else {
+						return 'Log is empty.';
+					}
+				}).filter(Boolean);
+				return { value: loglines.join('\n'), rows: loglines.length + 1 };
+			}).catch(function(err) {
+				ui.addNotification(null, E('p', {}, _('Unable to load log data: ' + err.message)));
+				return '';
+			});
+		});
+	},
+
+	pollLog: async function() {
+		const element = document.getElementById('syslog');
+		if (element) {
+			const log = await this.retrieveLog();
+			element.value = log.value;
+			element.rows = log.rows;
+		}
+	},
+
+	load: async function() {
+		poll.add(this.pollLog.bind(this));
+		return await this.retrieveLog();
+	},
+
+	render: function(loglines) {
+		var scrollDownButton = E('button', { 
+				'id': 'scrollDownButton',
+				'class': 'cbi-button cbi-button-neutral'
+			}, _('Scroll to tail', 'scroll to bottom (the tail) of the log file')
+		);
+		scrollDownButton.addEventListener('click', function() {
+			scrollUpButton.scrollIntoView();
+		});
+
+		var scrollUpButton = E('button', { 
+				'id' : 'scrollUpButton',
+				'class': 'cbi-button cbi-button-neutral'
+			}, _('Scroll to head', 'scroll to top (the head) of the log file')
+		);
+		scrollUpButton.addEventListener('click', function() {
+			scrollDownButton.scrollIntoView();
+		});
+
+		return E([], [
+			E('div', { 'id': 'content_syslog' }, [
+				E('div', {'style': 'padding-bottom: 20px'}, [scrollDownButton]),
+				E('textarea', {
+					'id': 'syslog',
+					'style': 'font-size:12px',
+					'readonly': 'readonly',
+					'wrap': 'off',
+					'rows': loglines.rows,
+				}, [ loglines.value ]),
+				E('div', {'style': 'padding-bottom: 20px'}, [scrollUpButton])
+			])
+		]);
+	},
+
+	handleSaveApply: null,
+	handleSave: null,
+	handleReset: null
+});