From 30b30dcca6032bc6331e5005bd1e0ec1af58b146 Mon Sep 17 00:00:00 2001 From: divocat Date: Sat, 18 Oct 2025 00:27:06 +0300 Subject: [PATCH] feat: integrate additional actions on diagnostics tab --- .../src/partials/modal/renderModal.ts | 25 +++- fe-app-podkop/src/partials/modal/styles.ts | 20 ++- .../podkop/tabs/diagnostic/initController.ts | 97 ++++++++++++- .../luci-static/resources/view/podkop/main.js | 130 +++++++++++++++++- 4 files changed, 261 insertions(+), 11 deletions(-) diff --git a/fe-app-podkop/src/partials/modal/renderModal.ts b/fe-app-podkop/src/partials/modal/renderModal.ts index b52c018..b7abcab 100644 --- a/fe-app-podkop/src/partials/modal/renderModal.ts +++ b/fe-app-podkop/src/partials/modal/renderModal.ts @@ -1 +1,24 @@ -export function renderModal() {} +import { renderButton } from '../button/renderButton'; + +export function renderModal(text: string) { + return E( + 'div', + { class: 'pdk-partial-modal__body' }, + E('div', {}, [ + E('pre', { class: 'pdk-partial-modal__content' }, E('code', {}, text)), + + E('div', { class: 'pdk-partial-modal__footer' }, [ + renderButton({ + classNames: ['cbi-button-apply'], + text: 'Copy content', + onClick: () => {}, + }), + renderButton({ + classNames: ['cbi-button-remove'], + text: 'Close modal', + onClick: ui.hideModal, + }), + ]), + ]), + ); +} diff --git a/fe-app-podkop/src/partials/modal/styles.ts b/fe-app-podkop/src/partials/modal/styles.ts index f017188..929e5ec 100644 --- a/fe-app-podkop/src/partials/modal/styles.ts +++ b/fe-app-podkop/src/partials/modal/styles.ts @@ -1,2 +1,20 @@ // language=CSS -export const styles = ``; +export const styles = ` + +.pdk-partial-modal__body {} + +.pdk-partial-modal__content { + max-height: 70vh; + overflow: scroll; + border-radius: 4px; +} + +.pdk-partial-modal__footer { + display: flex; + justify-content: flex-end; +} + +.pdk-partial-modal__footer button { + margin-left: 10px; +} +`; diff --git a/fe-app-podkop/src/podkop/tabs/diagnostic/initController.ts b/fe-app-podkop/src/podkop/tabs/diagnostic/initController.ts index 1c684b8..da45fe9 100644 --- a/fe-app-podkop/src/podkop/tabs/diagnostic/initController.ts +++ b/fe-app-podkop/src/podkop/tabs/diagnostic/initController.ts @@ -15,6 +15,7 @@ import { import { PodkopShellMethods } from '../../methods'; import { fetchServicesInfo } from '../../fetchers'; import { normalizeCompiledVersion } from '../../../helpers/normalizeCompiledVersion'; +import { renderModal } from '../../../partials'; async function fetchSystemInfo() { const systemInfo = await PodkopShellMethods.getSystemInfo(); @@ -200,6 +201,96 @@ async function handleDisable() { } } +async function handleShowGlobalCheck() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + globalCheck: { loading: true }, + }, + }); + + try { + const globalCheck = await PodkopShellMethods.globalCheck(); + + if (globalCheck.success) { + console.log('globalCheck', globalCheck.data); + + ui.showModal('Global check', renderModal(globalCheck.data as string)); + } + } catch (e) { + console.log('handleShowGlobalCheck - e', e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + globalCheck: { loading: false }, + }, + }); + } +} + +async function handleViewLogs() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + viewLogs: { loading: true }, + }, + }); + + try { + const viewLogs = await PodkopShellMethods.checkLogs(); + + if (viewLogs.success) { + console.log('viewLogs', viewLogs.data); + + ui.showModal('View logs', renderModal(viewLogs.data as string)); + } + } catch (e) { + console.log('handleViewLogs - e', e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + viewLogs: { loading: false }, + }, + }); + } +} + +async function handleShowSingBoxConfig() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + showSingBoxConfig: { loading: true }, + }, + }); + + try { + const showSingBoxConfig = await PodkopShellMethods.showSingBoxConfig(); + + if (showSingBoxConfig.success) { + console.log('showSingBoxConfig', showSingBoxConfig.data); + + ui.showModal( + 'Show sing-box config', + renderModal(showSingBoxConfig.data as string), + ); + } + } catch (e) { + console.log('handleViewLogs - e', e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + showSingBoxConfig: { loading: false }, + }, + }); + } +} + function renderDiagnosticAvailableActionsWidget() { const diagnosticsActions = store.get().diagnosticsActions; const servicesInfoWidget = store.get().servicesInfoWidget; @@ -249,19 +340,19 @@ function renderDiagnosticAvailableActionsWidget() { globalCheck: { loading: diagnosticsActions.globalCheck.loading, visible: true, - onClick: () => ui.showModal('globalCheck', E('div', {}, 'Example')), + onClick: handleShowGlobalCheck, disabled: atLeastOneServiceCommandLoading, }, viewLogs: { loading: diagnosticsActions.viewLogs.loading, visible: true, - onClick: () => {}, + onClick: handleViewLogs, disabled: atLeastOneServiceCommandLoading, }, showSingBoxConfig: { loading: diagnosticsActions.showSingBoxConfig.loading, visible: true, - onClick: () => {}, + onClick: handleShowSingBoxConfig, disabled: atLeastOneServiceCommandLoading, }, }); diff --git a/luci-app-podkop/htdocs/luci-static/resources/view/podkop/main.js b/luci-app-podkop/htdocs/luci-static/resources/view/podkop/main.js index 24fe606..8b7abde 100644 --- a/luci-app-podkop/htdocs/luci-static/resources/view/podkop/main.js +++ b/luci-app-podkop/htdocs/luci-static/resources/view/podkop/main.js @@ -2398,7 +2398,25 @@ var styles2 = ` `; // src/partials/modal/styles.ts -var styles3 = ``; +var styles3 = ` + +.pdk-partial-modal__body {} + +.pdk-partial-modal__content { + max-height: 70vh; + overflow: scroll; + border-radius: 4px; +} + +.pdk-partial-modal__footer { + display: flex; + justify-content: flex-end; +} + +.pdk-partial-modal__footer button { + margin-left: 10px; +} +`; // src/icons/renderLoaderCircleIcon24.ts function renderLoaderCircleIcon24() { @@ -2936,6 +2954,30 @@ function renderButton({ ); } +// src/partials/modal/renderModal.ts +function renderModal(text) { + return E( + "div", + { class: "pdk-partial-modal__body" }, + E("div", {}, [ + E("pre", { class: "pdk-partial-modal__content" }, E("code", {}, text)), + E("div", { class: "pdk-partial-modal__footer" }, [ + renderButton({ + classNames: ["cbi-button-apply"], + text: "Copy content", + onClick: () => { + } + }), + renderButton({ + classNames: ["cbi-button-remove"], + text: "Close modal", + onClick: ui.hideModal + }) + ]) + ]) + ); +} + // src/partials/index.ts var PartialStyles = ` ${styles2} @@ -3411,6 +3453,84 @@ async function handleDisable() { }); } } +async function handleShowGlobalCheck() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + globalCheck: { loading: true } + } + }); + try { + const globalCheck = await PodkopShellMethods.globalCheck(); + if (globalCheck.success) { + console.log("globalCheck", globalCheck.data); + ui.showModal("Global check", renderModal(globalCheck.data)); + } + } catch (e) { + console.log("handleShowGlobalCheck - e", e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + globalCheck: { loading: false } + } + }); + } +} +async function handleViewLogs() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + viewLogs: { loading: true } + } + }); + try { + const viewLogs = await PodkopShellMethods.checkLogs(); + if (viewLogs.success) { + console.log("viewLogs", viewLogs.data); + ui.showModal("View logs", renderModal(viewLogs.data)); + } + } catch (e) { + console.log("handleViewLogs - e", e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + viewLogs: { loading: false } + } + }); + } +} +async function handleShowSingBoxConfig() { + const diagnosticsActions = store.get().diagnosticsActions; + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + showSingBoxConfig: { loading: true } + } + }); + try { + const showSingBoxConfig = await PodkopShellMethods.showSingBoxConfig(); + if (showSingBoxConfig.success) { + console.log("showSingBoxConfig", showSingBoxConfig.data); + ui.showModal( + "Show sing-box config", + renderModal(showSingBoxConfig.data) + ); + } + } catch (e) { + console.log("handleViewLogs - e", e); + } finally { + store.set({ + diagnosticsActions: { + ...diagnosticsActions, + showSingBoxConfig: { loading: false } + } + }); + } +} function renderDiagnosticAvailableActionsWidget() { const diagnosticsActions = store.get().diagnosticsActions; const servicesInfoWidget = store.get().servicesInfoWidget; @@ -3453,21 +3573,19 @@ function renderDiagnosticAvailableActionsWidget() { globalCheck: { loading: diagnosticsActions.globalCheck.loading, visible: true, - onClick: () => ui.showModal("globalCheck", E("div", {}, "Example")), + onClick: handleShowGlobalCheck, disabled: atLeastOneServiceCommandLoading }, viewLogs: { loading: diagnosticsActions.viewLogs.loading, visible: true, - onClick: () => { - }, + onClick: handleViewLogs, disabled: atLeastOneServiceCommandLoading }, showSingBoxConfig: { loading: diagnosticsActions.showSingBoxConfig.loading, visible: true, - onClick: () => { - }, + onClick: handleShowSingBoxConfig, disabled: atLeastOneServiceCommandLoading } });