🗽 Sync 2026-10-23 00:46:23

luci-app-kaiplus/luasrc/view/kaiplus/kaiplus_status.htm

@@ -1,7 +1,68 @@
+<%+tasks/embed%>
+
+<style type="text/css">
+.kaiplus-actions {
+	display: flex;
+	flex-wrap: wrap;
+	align-items: center;
+	gap: 8px;
+	margin: 16px;
+}
+.kaiplus-actions .cbi-button {
+	min-height: 40px;
+	transition: transform 120ms ease-out;
+}
+.kaiplus-actions .cbi-button:active {
+	transform: scale(0.96);
+}
+</style>
+
 <script type="text/javascript">//<![CDATA[
+var kaiInstalled = false;
+var kaiLuciUrl = '<%=url("admin/services/kai")%>';
+var kaiInstallUrl = '<%=url("admin/services/kaiplus/install_kai")%>';
+var kaiCsrfToken = (window.taskd && window.taskd.csrfToken) || '';
+
+function openClassicKai() {
+	var button = document.getElementById('kaiplus-open-kai');
+	if (kaiInstalled) {
+		window.location.href = kaiLuciUrl;
+		return;
+	}
+	if (!window.confirm('<%:Classic KAI is not installed. Install it now?%>')) return;
+	if (!window.taskd || !window.taskd.show_log) {
+		window.alert('<%:Task log window is not available.%>');
+		return;
+	}
+
+	button.disabled = true;
+	button.value = '<%:Starting installation...%>';
+	(new XHR()).post(kaiInstallUrl, { token: kaiCsrfToken }, function(x) {
+		var data = {};
+		button.disabled = false;
+		button.value = '<%:Classic KAI%>';
+		if (x && x.responseText) {
+			try { data = JSON.parse(x.responseText || '{}'); }
+			catch (e) { data = {}; }
+		}
+		if (!data.ok) {
+			window.alert(data.error || '<%:Failed to start KAI installation.%>');
+			return;
+		}
+		if (data.installed) {
+			kaiInstalled = true;
+			window.location.href = kaiLuciUrl;
+			return;
+		}
+		window.taskd.show_log(data.task_id || 'kaiplus-kai-install');
+	});
+}
+
 XHR.poll(5, '<%=url("admin/services/kaiplus_status")%>', null, function(x, st) {
 	var el = document.getElementById('kaiplus_status');
+	var openButton = document.getElementById('kaiplus-open');
 	if (st && el) {
+		kaiInstalled = st.kai_installed === true;
 		var status = st.running
 			? '<br/><em style=\"color:green\"><%:The KaiPlus service is running.%></em>'
 			: '<br/><em style=\"color:red\"><%:The KaiPlus service is not running.%></em>';
@@ -15,10 +76,7 @@ XHR.poll(5, '<%=url("admin/services/kaiplus_status")%>', null, function(x, st) {
 			status = status + '<br/><em><%:External port access is disabled.%></em>';
 		}
 		el.innerHTML = status;
-		if (st.running) {
-			el.innerHTML = el.innerHTML
-				+ "<br/><br/><input class=\"btn cbi-button cbi-button-apply\" type=\"button\" value=\" <%:Click to open KaiPlus%> \" onclick=\"window.open('<%=url("admin/services/kaiplus/open")%>')\"/>";
-		}
+		if (openButton) openButton.style.display = st.running ? '' : 'none';
 	}
 });
 //]]></script>
@@ -28,4 +86,8 @@ XHR.poll(5, '<%=url("admin/services/kaiplus_status")%>', null, function(x, st) {
 	<p id="kaiplus_status">
 		<em><%:Collecting data...%></em>
 	</p>
+	<div class="kaiplus-actions">
+		<input id="kaiplus-open" class="btn cbi-button cbi-button-apply" type="button" value=" <%:Click to open KaiPlus%> " onclick="window.open('<%=url("admin/services/kaiplus/open")%>')" style="display:none"/>
+		<input id="kaiplus-open-kai" class="btn cbi-button" type="button" value=" <%:Classic KAI%> " onclick="openClassicKai()"/>
+	</div>
 </fieldset>