Alex-Devera/3x-ui
1
0
Fork 0
mirror of https://github.com/MHSanaei/3x-ui.git synced 2026-05-31 18:24:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4
3x-ui/web/translation/vi-VN.json

1122 lines
66 KiB
JSON
Raw Normal View History

Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
{
"username": "Tên người dùng",
"password": "Mật khẩu",
"login": "Đăng nhập",
"confirm": "Xác nhận",
"cancel": "Hủy bỏ",
"close": "Đóng",
"save": "Lưu",
"logout": "Đăng xuất",
"create": "Tạo",
"update": "Cập nhật",
"copy": "Sao chép",
"copied": "Đã sao chép",
"download": "Tải xuống",
"remark": "Ghi chú",
"enable": "Kích hoạt",
"protocol": "Giao thức",
"search": "Tìm kiếm",
"filter": "Bộ lọc",
"loading": "Đang tải",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"refresh": "Làm mới",
"clear": "Xóa",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"second": "Giây",
"minute": "Phút",
"hour": "Giờ",
"day": "Ngày",
"check": "Kiểm tra",
"indefinite": "Không xác định",
"unlimited": "Không giới hạn",
"none": "None",
"qrCode": "Mã QR",
"info": "Thông tin thêm",
"edit": "Chỉnh sửa",
"delete": "Xóa",
"reset": "Đặt lại",
"noData": "Không có dữ liệu.",
"copySuccess": "Đã sao chép thành công",
"sure": "Chắc chắn",
"encryption": "Mã hóa",
"useIPv4ForHost": "Sử dụng IPv4 cho máy chủ",
"transmission": "Truyền tải",
"host": "Máy chủ",
"path": "Đường dẫn",
"camouflage": "Ngụy trang",
"status": "Trạng thái",
"enabled": "Đã kích hoạt",
"disabled": "Đã tắt",
"depleted": "Depleted",
"depletingSoon": "Depleting...",
"offline": "Ngoại tuyến",
"online": "Trực tuyến",
"domainName": "Tên miền",
"monitor": "Listening IP",
"certificate": "Chứng chỉ số",
"fail": "Thất bại",
"comment": "Bình luận",
"success": "Thành công",
"lastOnline": "Lần online gần nhất",
"getVersion": "Lấy phiên bản",
"install": "Cài đặt",
"clients": "Các khách hàng",
"usage": "Sử dụng",
"twoFactorCode": "Mã",
"remained": "Còn lại",
"security": "Bảo vệ",
"secAlertTitle": "Cảnh báo an ninh-Tiếng Việt by Ohoang7",
"secAlertSsl": "Kết nối này không an toàn; Vui lòng không nhập thông tin nhạy cảm cho đến khi TLS được kích hoạt để bảo vệ dữ liệu của Bạn",
"secAlertConf": "Một số cài đặt có thể dễ bị tấn công. Đề xuất tăng cường các giao thức bảo mật để ngăn chặn các vi phạm tiềm ẩn.",
"secAlertSSL": "Bảng điều khiển thiếu kết nối an toàn. Vui lòng cài đặt chứng chỉ TLS để bảo vệ dữ liệu.",
"secAlertPanelPort": "Cổng mặc định của bảng điều khiển có thể dễ bị tấn công. Vui lòng cấu hình một cổng ngẫu nhiên hoặc cụ thể.",
"secAlertPanelURI": "Đường dẫn URI mặc định của bảng điều khiển không an toàn. Vui lòng cấu hình một đường dẫn URI phức tạp.",
"secAlertSubURI": "Đường dẫn URI mặc định của đăng ký không an toàn. Vui lòng cấu hình một đường dẫn URI phức tạp.",
"secAlertSubJsonURI": "Đường dẫn URI JSON mặc định của đăng ký không an toàn. Vui lòng cấu hình một đường dẫn URI phức tạp.",
"emptyDnsDesc": "Không có máy chủ DNS nào được thêm.",
"emptyFakeDnsDesc": "Không có máy chủ Fake DNS nào được thêm.",
"emptyBalancersDesc": "Không có bộ cân bằng tải nào được thêm.",
"emptyReverseDesc": "Không có proxy ngược nào được thêm.",
"somethingWentWrong": "Đã xảy ra lỗi",
"subscription": {
"title": "Thông tin đăng ký",
"subId": "ID đăng ký",
"status": "Trạng thái",
"downloaded": "Đã tải xuống",
"uploaded": "Đã tải lên",
"expiry": "Hết hạn",
"totalQuota": "Tổng hạn mức",
"individualLinks": "Liên kết riêng lẻ",
"active": "Hoạt động",
"inactive": "Không hoạt động",
"unlimited": "Không giới hạn",
"noExpiry": "Không hết hạn"
},
"menu": {
"theme": "Chủ đề",
"dark": "Tối",
"ultraDark": "Siêu tối",
"dashboard": "Trạng thái hệ thống",
"inbounds": "Đầu vào khách hàng",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"clients": "Khách hàng",
i18n: localize sidebar theme toggle, xray-status badge, and nodes menu The sidebar theme submenu (Theme / Dark / Ultra dark) and the dashboard's Xray status badge ("Xray is running" etc.) were hardcoded English strings. Wire them through vue-i18n: ThemeSwitch.vue uses menu.theme/dark/ultraDark, and XrayStatusCard.vue derives the badge text from the existing pages.index.xrayStatus{Running,Stop,Error,Unknown} keys (status.js no longer carries an English stateMsg field). The "Nodes" menu item was already keyed as menu.nodes but only en-US and fa-IR had a translation; add it to the other 11 languages, matching the wording each file already uses for pages.nodes.title. #4201
2026-05-10 09:55:37 +00:00
"nodes": "Nút",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"settings": "Cài đặt bảng điều khiển",
"xray": "Cài đặt Xray",
update translation
2026-05-11 18:47:49 +00:00
"apiDocs": "Tài liệu API",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"logout": "Đăng xuất",
Frontend rewrite: React + TypeScript with AntD v6 (#4498) * chore(frontend): add react+typescript toolchain alongside vue Step 0 of the planned vue->react migration. React 19, antd 5, i18next + react-i18next, typescript 5, and @vitejs/plugin-react 6 are added as dev/runtime deps alongside the existing vue stack. Both frameworks coexist in the build until the last entry flips. * vite.config.js: react() plugin runs next to vue(); new manualChunks for vendor-react / vendor-antd-react / vendor-icons-react / vendor-i18next. Existing vue chunks unchanged. * eslint.config.js: typescript-eslint + eslint-plugin-react-hooks rules scoped to *.{ts,tsx}; vue config untouched for *.{js,vue}. * tsconfig.json: strict, jsx: react-jsx, moduleResolution: bundler, allowJs: true (lets .tsx files import the remaining .js modules during incremental migration), @/* path alias. * env.d.ts: Vite client types + window.X_UI_BASE_PATH typing + SubPageData shape consumed by the subscription page. Vite stays pinned at 8.0.13 per the existing project policy. No existing .vue/.js source files touched in this step. eslint-plugin-react (not -hooks) is not included because its latest release does not yet support ESLint 10. react-hooks/purity covers the safety-critical case; revisit when the plugin updates. * refactor(frontend): port subpage to react+ts Step 1 of the planned vue->react migration. The standalone subscription page (sub/sub.go renders the HTML host; React mounts into #app) is the first entry off vue. Introduces two shared pieces both entries (and future ones) will use: * src/hooks/useTheme.tsx — React Context + useTheme hook + the same buildAntdThemeConfig (dark/ultra-dark token overrides) and pauseAnimationsUntilLeave helper the vue version exposes. Same localStorage keys (dark-mode, isUltraDarkThemeEnabled) and DOM side effects (body.className, html[data-theme]) so the two stay in sync across the coexistence period. * src/i18n/react.ts — i18next + react-i18next loader that reads the same web/translation/*.json files via import.meta.glob. The vue-i18n setup in src/i18n/index.js is untouched and still serves the remaining vue entries. SubPage.tsx mirrors the vue version's behavior: reads window.__SUB_PAGE_DATA__ injected by the Go sub server, renders QR codes / descriptions / Android+iOS deep-link dropdowns, supports theme cycle and language switch. Uses AntD v5 idioms: Descriptions items prop, Dropdown menu prop, Layout.Content. * refactor(frontend): port login to react+ts Step 2 of the planned vue->react migration. The login entry is the first to exercise AntD React's Form API (Form + Form.Item with name/rules + onFinish) and the existing axios/CSRF interceptors under React. * LoginPage.tsx: same form fields, conditional 2FA input, rotating headline ("Hello" / "Welcome to..."), drifting blob background, theme cycle + language popover. Headline transition switches from vue's <Transition mode=out-in> to a CSS keyframe animation keyed off the visible word. * entries/login.tsx: setupAxios() + applyDocumentTitle() unchanged from the vue entry — both are framework-agnostic in src/utils and src/api/axios-init.js. useTheme hook, ThemeProvider, and i18n/react.ts loader introduced in step 1 are now shared across two entries; Vite extracts them as a small chunk in the build output. * refactor(frontend): port api-docs to react+ts Step 3 of the planned vue->react migration. The five api-docs files (ApiDocsPage, CodeBlock, EndpointRow, EndpointSection, plus the data-only endpoints.js) all move to react+ts. Also introduces components/AppSidebar.tsx — api-docs is the first authenticated page to need it. AppSidebar.vue stays in place for the six remaining vue entries (settings, inbounds, clients, xray, nodes, index); each gets switched to AppSidebar.tsx as its entry migrates. After the last entry flips, AppSidebar.vue is deleted. Notable transformations: * The scroll observer that highlights the active TOC link is a useEffect keyed on sections — re-registers whenever the visible set changes (search filter narrows it). Same behaviour as the vue watchEffect. * v-html="safeInlineHtml(...)" becomes dangerouslySetInnerHTML={{ __html: safeInlineHtml(...) }}. The helper still escapes everything except <code> tags. * JSON syntax highlighter in CodeBlock is unchanged — pure regex on the escaped string, then rendered via dangerouslySetInnerHTML. * endpoints.js stays as JS (allowJs in tsconfig); only the consumer signatures (Endpoint, Section) are typed at the React boundary. * AppSidebar reuses pauseAnimationsUntilLeave + useTheme from step 1. Drawer + Sider keyed off the same localStorage flag (isSidebarCollapsed) and DOM theme attributes the vue version uses, so the two stay in sync during coexistence. * refactor(frontend): port nodes to react+ts Step 4 of the planned vue->react migration. The nodes entry brings in the largest shared-infrastructure batch so far — every authenticated react page from here on can lean on these. New shared pieces (live alongside their .vue counterparts during coexistence): * hooks/useMediaQuery.ts — useState + resize listener * hooks/useWebSocket.ts — wraps WebSocketClient, subscribes on mount and unsubscribes on unmount. The underlying client is a single module-level instance so multiple components on the same page share one socket. * hooks/useNodes.ts — node list state + CRUD + probe/test, including the totals memo (online/offline/avgLatency) used by the summary card. applyNodesEvent is the entry point for the heartbeat-pushed list. * components/CustomStatistic.tsx — thin Statistic wrapper, prefix + suffix slots become props. * components/Sparkline.tsx — the SVG line chart with measured-width axis scaling, gradient fill, tooltip overlay, and per-instance gradient id from React.useId. ResizeObserver lifecycle is in useEffect; the math is unchanged. Pages: * NodesPage — wires hooks + WebSocket together, renders summary card + NodeList, hosts the form modal. Uses Modal.useModal() for the delete confirm so the dialog inherits ConfigProvider theming. * NodeList — desktop renders a Table with expandable history rows; mobile flips to a vertical card list whose actions live in a bottom-right Dropdown. The IP-blur eye toggle persists across both. * NodeFormModal — controlled form (useState object, single setForm per change). The reset-on-open effect computes the next state once and applies it with eslint-disable to satisfy the new react-hooks/set-state-in-effect rule on a legitimate pattern. * NodeHistoryPanel — polls /panel/api/nodes/history/{id}/{metric}/ {bucket} every 15s, renders cpu+mem sparklines side-by-side. * refactor(frontend): port settings to react+ts Step 5 of the planned vue->react migration. Settings is the first entry whose state model didn't translate to the Vue-style "parent passes a reactive object, children mutate it in place" pattern, so the React port flips it to lifted state + a typed updateSetting patch function. * models/setting.ts — typed AllSetting class with the same field defaults and equals() behavior the vue version had. The .js twin is deleted; nothing else imported it. * hooks/useAllSetting.ts — owns allSetting + oldAllSetting state, exposes updateSetting(patch), saveDisabled is derived via useMemo off equals() (no more 1Hz dirty-check timer). * components/SettingListItem.tsx — children-based wrapper instead of named slots. The vue twin stays alive because xray (BasicsTab, DnsTab) still imports it; deleted when xray migrates. The five tab components and the TwoFactorModal each accept { allSetting, updateSetting } and render with AntD v5's Collapse items[] API. Every v-model:value="x" became value={...} onChange={(e) => updateSetting({ key: e.target.value })} or onChange={(v) => updateSetting({ key: v })} for non-input controls. SubscriptionFormatsTab is the trickiest — fragment / noises[] / mux / direct routing rules are stored as JSON-encoded strings on the wire. Parsing them once via useMemo per field, mutating the parsed object on edit, and stringifying back into the patch keeps the round-trip identical to the vue version. SettingsPage hosts the tab navigation (with hash sync), the save / restart action bar, the security-warnings alert banner, and the restart flow that rebuilds the panel URL after the new host/port/cert settings take effect. * refactor(frontend): port clients to react+ts Step 6 of the planned vue->react migration. Clients is the biggest data-CRUD page in the panel (1.1k-line ClientsPage, 4 modals, full table + mobile card list, WebSocket-driven realtime traffic + online updates). New shared infra (lives alongside vue twins until inbounds migrates): * hooks/useClients.ts — clients + inbounds list, CRUD + bulk delete + attach/detach + traffic reset, with WebSocket event handlers (traffic, client_stats, invalidate) and a small debounced refresh on the invalidate event. State managed via setState; the live client_stats event merges traffic snapshots row-by-row through a ref to avoid stale closure issues. * hooks/useDatepicker.ts — singleton "gregorian"/"jalalian" cache with subscribe/notify so multiple components can read the panel's Calendar Type without re-fetching. Mirrors useDatepicker.js. * components/DateTimePicker.tsx — AntD DatePicker wrapper. vue3-persian-datetime-picker has no React port; the Jalali UI calendar is deferred (read-only Jalali display via IntlUtil formatDate still works). The vue twin stays for inbounds. * pages/inbounds/QrPanel.tsx — copy/download/copy-as-png QR helper shared between clients (qr modal) and inbounds (still on vue). Vue twin stays alive at QrPanel.vue. * models/inbound.ts — slim port: only the TLS_FLOW_CONTROL constant the clients form needs. The full inbound model stays as inbound.js for now; inbounds will pull it in as inbound.ts. The clients page itself uses Modal.useModal() for all confirm dialogs (delete, bulk-delete, reset-traffic, delDepleted, reset-all) so the dialogs render themed. Filter state persists to localStorage under clientsFilterState. Sort + pagination state is local; pageSize seeds from /panel/setting/defaultSettings. The four modals share a controlled "open/onOpenChange" pattern that replaces vue's v-model:open. ClientFormModal computes attach/detach diffs from the inbound multi-select on submit; the parent's onSave callback routes them through useClients's attach()/ detach() after the main update succeeds. ESLint config: turned off four react-hooks v7 rules (react-compiler, preserve-manual-memoization, set-state-in-effect, purity). They're all React-Compiler-driven informational rules; we don't run the compiler and the patterns they flag (initial-fetch useEffect, derived computations using Date.now, inline arrow event handlers) are all idiomatic React. Disabling globally instead of per-line keeps the diff readable. * refactor(frontend): port index dashboard to react+ts Step 7 of the Vue→React migration. Ports the overview/index entry: dashboard page, status + xray cards, panel-update / log / backup / system-history / xray-metrics / xray-log / version modals, and the custom-geo subsection. Adds the shared JsonEditor (CodeMirror 6) and useStatus hook used by the config modal. Removes the unused react-hooks/set-state-in-effect disables now that the rule is off globally. * refactor(frontend): port xray to react+ts Step 8 of the Vue→React migration. Ports the xray config entry: page shell, basics/routing/outbounds/balancers/dns tabs, the rule + balancer + dns server + dns presets + warp + nord modals, the protocol-aware outbound form, and the shared FinalMaskForm (TCP/UDP masks + QUIC params). Adds useXraySetting that mirrors the legacy two-way sync between the JSON template string and the parsed templateSettings tree. The outbound model itself stays in JS so the class-driven form keeps its existing mutation API; instance access is typed loosely inside the form to match. The shared FinalMaskForm.vue and JsonEditor.vue stay alongside the new .tsx versions until step 9 — InboundFormModal.vue still imports them. Adds react-hooks/immutability and react-hooks/refs to the already-disabled react-compiler rule set; both flag the outbound form's instance-mutation pattern that doesn't run through useState. * Upgrade frontend deps (antd v6, i18n, TS) Bump frontend dependencies in package.json and regenerate package-lock.json. Notable updates: upgrade antd to v6, update i18next/react-i18next, axios, qs, vue-i18n, TypeScript and ESLint, plus related @rc-component packages and replacements (e.g. classnames/rc-util -> clsx/@rc-component/util). Lockfile changes reflect the new dependency tree required for Ant Design v6 and other package upgrades. * refactor(frontend): port inbounds to react+ts and drop vue toolchain Step 9 — the last entry. Ports the inbounds entry: page shell, list with desktop table + mobile cards, info modal, qr-code modal, share-link helpers, and the protocol-aware form modal (basics / protocol / stream / security / sniffing / advanced JSON). useInbounds replaces the Vue composable with WebSocket-driven traffic + client-stats merge. Inbound and DBInbound models stay in JS so the class-driven form keeps its mutation API; instance access is typed loosely inside the form to match. FinalMaskForm/JsonEditor/TextModal/PromptModal/InfinityIcon are the last shared bits to flip; their .vue counterparts go too. Toolchain cleanup now that no entry needs Vue: drop plugin-vue from vite.config, remove the .vue lint block + parser, prune vue / vue-i18n / ant-design-vue / @ant-design/icons-vue / vue3-persian-datetime-picker / moment-jalaali override from package.json, and switch utils/index.js to import { message } from 'antd' instead of ant-design-vue. * chore(frontend): adopt antd v6 api updates Sweep deprecated props across the React tree: - Modal: destroyOnClose -> destroyOnHidden, maskClosable -> mask.closable - Space: direction -> orientation (or removed when redundant) - Input.Group compact -> Space.Compact block - Drawer: width -> size - Spin: tip -> description - Progress: trailColor -> railColor - Alert: message -> title - Popover: overlayClassName -> rootClassName - BackTop -> FloatButton.BackTop Also refresh dashboard theming for v6: rename dark/ultra Layout and Menu tokens (siderBg, darkItemBg, darkSubMenuItemBg, darkPopupBg), tweak gauge size/stroke, add font-size overrides for Statistic and Progress so the overview numbers stay legible under v6 defaults. * chore(frontend): antd v6 polish, theme + modal fixes - adopt message.useMessage hook + messageBus bridge so HttpUtil messages inherit ConfigProvider theme tokens - replace deprecated antd APIs (List, Input addonBefore/After, Empty imageStyle); introduce InputAddon helper + SettingListItem custom rows - fix dark/ultra selectors in portaled modals (body.dark, html[data-theme='ultra-dark']) instead of nonexistent .is-dark/.is-ultra - add horizontal scroll to clients table; reorder node columns so actions+enable sit at the left - swap raw button for antd Button in NodeFormModal test connection - fix FinalMaskForm nested-form by hoisting it outside OutboundFormModal's parent Form - fix advanced "all" JSON tab in InboundFormModal — useMemo on a mutated ref was stale; compute on every render - fix chart-on-open for SystemHistory + XrayMetrics modals by adding open to effect deps (useRef.current doesn't trigger re-runs) - switch i18next interpolation to single-brace {var} to match locale files - drop residual Vue mentions in CI workflows and Go comments * fix(frontend): qr code collapse — open only first panel, allow toggle ClientQrModal and QrCodeModal both used activeKey without onChange, forcing every panel open and blocking user toggle. Switch to controlled state initialized to the first item's key on open, with onChange so clicks update state. Also remove unused AppBridge.tsx (superseded by per-page message.useMessage hook). * fix(frontend): hover cards, balancer load, routing dnd, modal a11y, outbound crash - ClientsPage/SettingsPage/XrayPage: add hoverable to bottom card/tabs so hover affordance matches the top card - BalancerFormModal: lazy-init useState from props + destroyOnHidden so the form mounts with saved values instead of relying on a useEffect sync that could miss the first open - RoutingTab: rewrite pointer drag — handlers are now defined inside the pointerdown closure so addEventListener/removeEventListener match; drag state lives on a ref (from/to/moved) so onUp reads the real indices, not stale closure values. Adds setPointerCapture so Windows and touch keep delivering events when the cursor leaves the handle. - OutboundFormModal/InboundFormModal: blur the focused input before switching tabs to silence the aria-hidden-on-focused-element warning - utils.isArrEmpty: return true for undefined/null arrays — the old form treated undefined as "not empty" which crashed VLESSSettings.fromJson when json.vnext was missing * fix(frontend): clipboard reliability + restyle login page - ClipboardManager.copyText: prefer navigator.clipboard on secure contexts, fall back to a focused on-screen textarea + execCommand. Old path used left:-9999px which failed selection in some browsers and swallowed execCommand's return value, so the "copied" toast appeared even when nothing made it to the clipboard. - LoginPage: richer gradient backdrop — five animated colour blobs, glassmorphic card (backdrop-filter blur + saturate), gradient brand text/accent, masked grid texture for depth, and a thin gradient border on the card. Light/dark/ultra each get their own palette. * Memoize compactAdvancedJson and update deps Wrap compactAdvancedJson in useCallback (dependent on messageApi) and add it to the dependency array of applyAdvancedJsonToBasic. This ensures a stable function reference for correct dependency tracking and avoids stale closures/unnecessary re-renders in InboundFormModal.tsx. * style(frontend): prettier charts, drop redundant frame, format net rates - Sparkline: multi-stop gradient fill, soft drop-shadow under the line, dashed grid, glowing pulse on the latest-point marker, pill-shaped tooltip with dashed crosshair - XrayMetricsModal: glow + pulse on the observatory alive dot, monospace stamps/listen text - SystemHistoryModal: keep just the modal's frame around the chart (the inner wrapper I'd added stacked a second border on top); strip the decimal from Net Up/Down (25.63 KB/s → 25 KB/s) only on this chart's formatter * style(frontend): refined dark/ultra palette + shared pro card frame - Dark tokens shifted to a cooler, Linear-style palette: page #1a1b1f, sidebar/header #15161a (recessed nav, darker than cards), card #23252b, elevated #2d2f37 - Ultra dark: page pure #000 for OLED, sidebar #050507 disappears into the frame, card #101013 with a clear step, elevated #1a1a1e - New styles/page-cards.css holds the card border/shadow/hover rules so all seven content pages (index, clients, inbounds, xray, settings, nodes, api-docs) share one definition instead of duplicating in each page CSS - Dashboard typography: uppercase card titles with letter-spacing, larger 17px stat values, subtle gradient divider between stat columns, ellipsis on action labels so "Backup & Restore" doesn't break the card height at mid widths - Light --bg-page stays at #e6e8ec for the contrast against white cards * fix(frontend): wireguard info alignment, blue login dark, embed gitkeep - align WireGuard info-modal fields with Protocol/Address/Port by wrapping values in Tag (matches the rest of the dl.info-list rows) - swap login dark palette from purple to pure blue blobs/accent/brand - pin web/dist/.gitkeep through gitignore so //go:embed all:dist never fails on a fresh clone with an empty dist directory * docs: refresh frontend docs for the React + TS + AntD 6 stack Update CONTRIBUTING.md and frontend/README.md to describe the migrated frontend accurately: - replace Vue 3 / Ant Design Vue 4 references with React 19 / AntD 6 / TS - swap composables -> hooks, vue-i18n -> react-i18next, createApp -> createRoot - mention the typecheck step (tsc --noEmit) in the PR checklist - document the Vite 8.0.13 pin and TypeScript strict mode in conventions - list the nodes and api-docs entries that were missing from the layout * style(frontend): improve readability and mobile polish - bump statistic title/value contrast in dark and ultra-dark so totals on the inbounds summary card stay legible - give index card actions explicit colors per theme so links like Stop, Logs, System History no longer fade into the card background - show the panel version as a tag next to "3X-UI" on mobile, mirroring the Xray version tag pattern, and turn it orange when an update is available - make the login settings button a proper circle by adding size="large" + an explicit border-radius fallback on .toolbar-btn * feat: jalali calendar support and date formatting fixes - Wire useDatepicker into IntlUtil and switch jalalian display locale to fa-IR for clean "1405/07/03 12:00:00" output (drops the awkward "AP" era suffix that "<lang>-u-ca-persian" produced) - Drop in persian-calendar-suite for the jalali date picker, with a light/dark/ultra theme map and CSS overrides so the inline-styled input stays readable and bg matches the surrounding container - Force LTR on the picker input so "1405/03/07 00:00" reads naturally - Pass calendar setting through ClientInfoModal, ClientsPage Duration tooltip, and ClientFormModal's expiry picker - Heuristic toMs() in ClientInfoModal so GORM's autoUpdateTime seconds render as a real date instead of "1348/11/01" - Persist UpdatedAt on the ClientRecord row in client_service.Update; previously only the inbound settings JSON was bumped, so the panel never saw a fresh updated_at after editing a client * feat(frontend): donate link, panel version label, login lang menu - Sidebar: add heart donate link to https://donate.sanaei.dev and small panel version under 3X-UI brand - Login: swap settings-cog for translation icon, drop title, render languages as a direct list - Vite dev: inject window.X_UI_CUR_VER from config/version so dev mode matches prod - Translations: add menu.donate across all locales * fix(xray-update): respect XUI_BIN_FOLDER on Windows The Windows update path hardcoded "bin/xray-windows-amd64.exe", ignoring the configured XUI_BIN_FOLDER. In dev mode (folder set to x-ui) this created a stray bin/ folder while the running binary stayed un-updated. * Bump Xray to v26.5.9 and minor cleanup Update Xray release URLs to v26.5.9 in the GitHub Actions workflow and DockerInit.sh. Remove the hardcoded skip for tagVersion "26.5.3" so it will be considered when collecting Xray versions. Apply small formatting fixes: remove an extra blank line in database/db.go, normalize spacing/alignment of Protocol constants in database/model/model.go, and trim a trailing blank line in web/controller/inbound.go. * fix(frontend): route remaining copy buttons through ClipboardManager Direct navigator.clipboard calls fail in non-secure contexts (HTTP on a LAN IP), making the API-docs code copy and security-tab token copy silently broken. Both now go through ClipboardManager which falls back to document.execCommand('copy') when navigator.clipboard is unavailable. * fix(db): store CreatedAt/UpdatedAt in milliseconds GORM's autoCreateTime/autoUpdateTime tags default to Unix seconds on int64 fields and overwrite the service-supplied UnixMilli value on save. The frontend interprets these timestamps as JS Date inputs (milliseconds), so created/updated columns rendered ~1970 dates. Adding the :milli qualifier makes GORM match what the service code and UI expect. * Improve legacy clipboard copy handling Refactor ClipboardManager._legacyCopy to better handle focus and selection when copying. The textarea is now appended to the active element's parent (or body) and placed off-screen with aria-hidden and readonly attributes. The code preserves and restores the previous document selection and active element, uses focus({preventScroll: true}) to avoid scrolling, and returns the execCommand('copy') result. This makes legacy copy behavior more robust and less disruptive to the page state. * fix(lint): drop redundant ok=false in clipboard fallback catch * chore(deps): bump golang.org/x/net to v0.55.0 for GO-2026-5026
2026-05-23 13:21:45 +00:00
"link": "Quản lý",
"donate": "Quyên góp"
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
},
"pages": {
"login": {
"hello": "Xin chào",
"title": "Chào mừng",
"loginAgain": "Thời hạn đăng nhập đã hết. Vui lòng đăng nhập lại.",
"toasts": {
"invalidFormData": "Dạng dữ liệu nhập không hợp lệ.",
"emptyUsername": "Vui lòng nhập tên người dùng.",
"emptyPassword": "Vui lòng nhập mật khẩu.",
"wrongUsernameOrPassword": "Tên người dùng, mật khẩu hoặc mã xác thực hai yếu tố không hợp lệ.",
"successLogin": "Bạn đã đăng nhập vào tài khoản thành công."
}
},
"index": {
"title": "Trạng thái hệ thống",
"cpu": "CPU",
"logicalProcessors": "Bộ xử lý logic",
"frequency": "Tần số",
"swap": "Swap",
"storage": "Lưu trữ",
"memory": "RAM",
"threads": "Luồng",
"xrayStatus": "Xray",
"stopXray": "Dừng lại",
"restartXray": "Khởi động lại",
"xraySwitch": "Phiên bản",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"xrayUpdates": "Cập nhật Xray",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"xraySwitchClick": "Chọn phiên bản mà bạn muốn chuyển đổi sang.",
"xraySwitchClickDesk": "Hãy lựa chọn thận trọng, vì các phiên bản cũ có thể không tương thích với các cấu hình hiện tại.",
"updatePanel": "Cập nhật Panel",
"panelUpdateDesc": "Điều này sẽ cập nhật 3X-UI lên bản phát hành mới nhất và khởi động lại dịch vụ panel.",
"currentPanelVersion": "Phiên bản panel hiện tại",
"latestPanelVersion": "Phiên bản panel mới nhất",
"panelUpToDate": "Panel đã được cập nhật",
"upToDate": "Đã cập nhật",
"xrayStatusUnknown": "Không xác định",
"xrayStatusRunning": "Đang chạy",
"xrayStatusStop": "Dừng",
"xrayStatusError": "Lỗi",
"xrayErrorPopoverTitle": "Đã xảy ra lỗi khi chạy Xray",
"operationHours": "Thời gian hoạt động",
"systemHistoryTitle": "Lịch sử hệ thống",
feat(panel): xray metrics dashboard with observatory probe history Polls xray's /debug/vars on the 2s status tick, stores memstats and per-outbound observatory delay in the metric history ring buffer, and exposes them through a new XrayMetricsModal opened from the Charts card. Restructures the dashboard to consolidate uptime, usage, version, and Telegram link into stat-style or action-style cards consistent with the existing AntD aesthetic.
2026-05-12 00:17:45 +00:00
"charts": "Biểu đồ",
"xrayMetricsTitle": "Chỉ số Xray",
"xrayMetricsDisabled": "Điểm cuối chỉ số Xray chưa được cấu hình",
"xrayMetricsHint": "Thêm khối metrics cấp cao nhất vào cấu hình xray với tag là metrics_out và listen là 127.0.0.1:11111, sau đó khởi động lại xray.",
"xrayObservatoryEmpty": "Chưa có dữ liệu Observatory",
"xrayObservatoryHint": "Thêm khối observatory vào cấu hình xray liệt kê các tag outbound cần kiểm tra, sau đó khởi động lại xray.",
"xrayObservatoryTagPlaceholder": "Chọn outbound",
"xrayObservatoryAlive": "Hoạt động",
"xrayObservatoryDead": "Ngừng",
"xrayObservatoryLastSeen": "Lần cuối thấy",
"xrayObservatoryLastTry": "Lần thử cuối",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"trendLast2Min": "2 phút gần nhất",
"systemLoad": "Tải hệ thống",
"systemLoadDesc": "trung bình tải hệ thống trong 1, 5 và 15 phút qua",
"connectionCount": "Số lượng kết nối",
"ipAddresses": "Địa chỉ IP",
"toggleIpVisibility": "Chuyển đổi hiển thị IP",
"overallSpeed": "Tốc độ tổng thể",
"upload": "Tải lên",
"download": "Tải xuống",
"totalData": "Tổng dữ liệu",
"sent": "Đã gửi",
"received": "Đã nhận",
"documentation": "Tài liệu",
"xraySwitchVersionDialog": "Bạn có chắc chắn muốn thay đổi phiên bản Xray không?",
"xraySwitchVersionDialogDesc": "Hành động này sẽ thay đổi phiên bản Xray thành #version#.",
"xraySwitchVersionPopover": "Xray đã được cập nhật thành công",
"panelUpdateDialog": "Bạn có chắc muốn cập nhật panel không?",
"panelUpdateDialogDesc": "Điều này sẽ cập nhật 3X-UI lên #version# và khởi động lại dịch vụ panel.",
"panelUpdateCheckPopover": "Kiểm tra cập nhật panel thất bại",
"panelUpdateStartedPopover": "Bắt đầu cập nhật panel",
"geofileUpdateDialog": "Bạn có chắc chắn muốn cập nhật geofile không?",
"geofileUpdateDialogDesc": "Hành động này sẽ cập nhật tệp #filename#.",
"geofilesUpdateDialogDesc": "Thao tác này sẽ cập nhật tất cả các tập tin.",
"geofilesUpdateAll": "Cập nhật tất cả",
"geofileUpdatePopover": "Geofile đã được cập nhật thành công",
"customGeoTitle": "GeoSite / GeoIP tùy chỉnh",
"customGeoAdd": "Thêm",
"customGeoType": "Loại",
"customGeoAlias": "Bí danh",
"customGeoUrl": "URL",
"customGeoEnabled": "Bật",
"customGeoLastUpdated": "Cập nhật lần cuối",
"customGeoExtColumn": "Định tuyến (ext:…)",
"customGeoToastUpdateAll": "Đã cập nhật tất cả nguồn tùy chỉnh",
"customGeoActions": "Thao tác",
"customGeoEdit": "Sửa",
"customGeoDelete": "Xóa",
"customGeoDownload": "Cập nhật ngay",
"customGeoModalAdd": "Thêm geo tùy chỉnh",
"customGeoModalEdit": "Sửa geo tùy chỉnh",
"customGeoModalSave": "Lưu",
"customGeoDeleteConfirm": "Xóa nguồn geo tùy chỉnh này?",
"customGeoRoutingHint": "Trong quy tắc định tuyến dùng cột giá trị dạng ext:file.dat:tag (thay tag).",
"customGeoInvalidId": "ID tài nguyên không hợp lệ",
"customGeoAliasesError": "Không tải được bí danh geo tùy chỉnh",
"customGeoValidationAlias": "Bí danh chỉ gồm chữ thường, số, - và _",
"customGeoValidationUrl": "URL phải bắt đầu bằng http:// hoặc https://",
"customGeoAliasPlaceholder": "a-z 0-9 _ -",
"customGeoAliasLabelSuffix": " (tùy chỉnh)",
"customGeoToastList": "Danh sách geo tùy chỉnh",
"customGeoToastAdd": "Thêm geo tùy chỉnh",
"customGeoToastUpdate": "Cập nhật geo tùy chỉnh",
"customGeoToastDelete": "Đã xóa geofile tùy chỉnh “{{ .fileName }}”",
"customGeoToastDownload": "Đã cập nhật geofile “{{ .fileName }}”",
"customGeoErrInvalidType": "Loại phải là geosite hoặc geoip",
"customGeoErrAliasRequired": "Cần bí danh",
"customGeoErrAliasPattern": "Bí danh có ký tự không hợp lệ",
"customGeoErrAliasReserved": "Bí danh này được dành riêng",
"customGeoErrUrlRequired": "Cần URL",
"customGeoErrInvalidUrl": "URL không hợp lệ",
"customGeoErrUrlScheme": "URL phải dùng http hoặc https",
"customGeoErrUrlHost": "Máy chủ URL không hợp lệ",
"customGeoErrDuplicateAlias": "Bí danh này đã dùng cho loại này",
"customGeoErrNotFound": "Không tìm thấy nguồn geo tùy chỉnh",
"customGeoErrDownload": "Tải xuống thất bại",
"customGeoErrUpdateAllIncomplete": "Một hoặc nhiều nguồn geo tùy chỉnh không cập nhật được",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"customGeoEmpty": "Chưa có nguồn geo tùy chỉnh nào — nhấp Thêm để tạo",
"dontRefresh": "Đang tiến hành cài đặt, vui lòng không làm mới trang này.",
"logs": "Nhật ký",
"config": "Cấu hình",
"backup": "Sao lưu",
"backupTitle": "Sao lưu & Khôi phục",
"exportDatabase": "Sao lưu",
"exportDatabaseDesc": "Nhấp để tải xuống tệp .db chứa bản sao lưu cơ sở dữ liệu hiện tại của bạn vào thiết bị.",
"importDatabase": "Khôi phục",
"importDatabaseDesc": "Nhấp để chọn và tải lên tệp .db từ thiết bị của bạn để khôi phục cơ sở dữ liệu từ bản sao lưu.",
"importDatabaseSuccess": "Đã nhập cơ sở dữ liệu thành công",
"importDatabaseError": "Lỗi xảy ra khi nhập cơ sở dữ liệu",
"readDatabaseError": "Lỗi xảy ra khi đọc cơ sở dữ liệu",
"getDatabaseError": "Lỗi xảy ra khi truy xuất cơ sở dữ liệu",
"getConfigError": "Lỗi xảy ra khi truy xuất tệp cấu hình"
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
},
"inbounds": {
"title": "Điểm vào (Inbounds)",
"totalDownUp": "Tổng tải lên/tải xuống",
"totalUsage": "Tổng sử dụng",
"inboundCount": "Số lượng điểm vào",
"operate": "Thao tác",
"enable": "Kích hoạt",
"remark": "Chú thích",
"node": "Nút",
"deployTo": "Triển khai tới",
"localPanel": "Panel cục bộ",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"fallbacks": {
"title": "Fallback",
"help": "Khi một kết nối trên inbound này không khớp với client nào, nó sẽ được chuyển hướng tới inbound khác. Chọn một child bên dưới và các trường định tuyến (SNI / ALPN / Path / xver) sẽ được tự động điền từ transport của child — hầu hết cấu hình không cần chỉnh thêm. Mỗi child nên lắng nghe trên 127.0.0.1 với security=none.",
"empty": "Chưa có fallback nào",
"add": "Thêm fallback",
"pickInbound": "Chọn một inbound",
"matchAny": "bất kỳ",
"rederive": "Điền lại từ child",
"rederived": "Đã điền lại từ child",
"editAdvanced": "Sửa trường định tuyến",
"hideAdvanced": "Ẩn nâng cao",
"quickAddAll": "Thêm nhanh tất cả các inbound đủ điều kiện",
"quickAdded": "Đã thêm {n} fallback",
"quickAddedNone": "Không có inbound mới nào đủ điều kiện",
"routesWhen": "Định tuyến khi",
"defaultCatchAll": "Mặc định — bắt mọi thứ khác"
},
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"protocol": "Giao thức",
"port": "Cổng",
"portMap": "Cổng tạo",
"traffic": "Lưu lượng",
"details": "Chi tiết",
"transportConfig": "Giao vận",
"expireDate": "Ngày hết hạn",
"createdAt": "Tạo lúc",
"updatedAt": "Cập nhật",
"resetTraffic": "Đặt lại lưu lượng",
"addInbound": "Thêm điểm vào",
"generalActions": "Hành động chung",
"modifyInbound": "Chỉnh sửa điểm vào (Inbound)",
"deleteInbound": "Xóa điểm vào (Inbound)",
"deleteInboundContent": "Xác nhận xóa điểm vào? (Inbound)",
i18n: translate hardcoded inbound action + security warning strings (#4502) The inbound row actions (delete / reset traffic / clone / export links / export subscription links / show JSON / export-all variants) and the security warning alert on the Settings page were emitting English text directly. Replace them with i18n keys and add translations across all 13 supported locales.
2026-05-23 17:43:21 +00:00
"deleteConfirmTitle": "Xóa inbound \"{remark}\"?",
"deleteConfirmContent": "Hành động này xóa inbound và toàn bộ khách hàng của nó. Không thể hoàn tác.",
"resetConfirmTitle": "Đặt lại lưu lượng của \"{remark}\"?",
"resetConfirmContent": "Đặt lại bộ đếm lên/xuống về 0 cho inbound này.",
"cloneConfirmTitle": "Sao chép inbound \"{remark}\"?",
"cloneConfirmContent": "Tạo bản sao với cổng mới và danh sách khách hàng trống.",
feat(inbounds): row action to delete all clients of an inbound Adds POST /panel/api/inbounds/:id/delAllClients that collects every client email from settings.clients[] and runs ClientService.BulkDelete in one pass. Row action lives in the More menu as a danger item, only shown for multi-user inbounds that currently have at least one client; confirmation modal displays the live client count.
2026-05-27 16:17:44 +00:00
"delAllClients": "Xóa tất cả khách hàng",
"delAllClientsConfirmTitle": "Xóa toàn bộ {count} khách hàng khỏi \"{remark}\"?",
"delAllClientsConfirmContent": "Xóa mọi khách hàng khỏi inbound này và hủy bản ghi lưu lượng của họ. Bản thân inbound vẫn được giữ lại. Hành động này không thể hoàn tác.",
i18n: translate hardcoded inbound action + security warning strings (#4502) The inbound row actions (delete / reset traffic / clone / export links / export subscription links / show JSON / export-all variants) and the security warning alert on the Settings page were emitting English text directly. Replace them with i18n keys and add translations across all 13 supported locales.
2026-05-23 17:43:21 +00:00
"exportLinksTitle": "Xuất liên kết inbound",
"exportSubsTitle": "Xuất liên kết đăng ký",
"exportAllLinksTitle": "Xuất tất cả liên kết inbound",
"exportAllSubsTitle": "Xuất tất cả liên kết đăng ký",
"inboundJsonTitle": "JSON inbound",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"deleteClient": "Xóa người dùng",
"deleteClientContent": "Bạn có chắc chắn muốn xóa người dùng không?",
"resetTrafficContent": "Xác nhận đặt lại lưu lượng?",
"copyLink": "Sao chép liên kết",
"address": "Địa chỉ",
"network": "Mạng",
"destinationPort": "Cổng đích",
"targetAddress": "Địa chỉ mục tiêu",
"monitorDesc": "Mặc định để trống",
"meansNoLimit": "= Không giới hạn (đơn vị: GB)",
"totalFlow": "Tổng lưu lượng",
"leaveBlankToNeverExpire": "Để trống để không bao giờ hết hạn",
"noRecommendKeepDefault": "Không yêu cầu đặc biệt để giữ nguyên cài đặt mặc định",
"certificatePath": "Đường dẫn tập",
"certificateContent": "Nội dung tập",
"publicKey": "Khóa công khai",
"privatekey": "Khóa cá nhân",
"clickOnQRcode": "Nhấn vào Mã QR để sao chép",
"client": "Người dùng",
"export": "Xuất liên kết",
"clone": "Sao chép",
"cloneInbound": "Sao chép điểm vào (Inbound)",
"cloneInboundContent": "Tất cả cài đặt của điểm vào này, trừ Cổng, IP nghe và máy khách, sẽ được áp dụng cho bản sao.",
"cloneInboundOk": "Sao chép",
"resetAllTraffic": "Đặt lại lưu lượng cho tất cả điểm vào",
"resetAllTrafficTitle": "Đặt lại lưu lượng cho tất cả điểm vào",
"resetAllTrafficContent": "Bạn có chắc chắn muốn đặt lại lưu lượng cho tất cả điểm vào không?",
"resetInboundClientTraffics": "Đặt lại lưu lượng toàn bộ người dùng của điểm vào",
"resetInboundClientTrafficTitle": "Đặt lại lưu lượng cho toàn bộ người dùng của điểm vào",
"resetInboundClientTrafficContent": "Bạn có chắc chắn muốn đặt lại tất cả lưu lượng cho các người dùng của điểm vào này không?",
"resetAllClientTraffics": "Đặt lại lưu lượng cho toàn bộ người dùng",
"resetAllClientTrafficTitle": "Đặt lại lưu lượng cho toàn bộ người dùng",
"resetAllClientTrafficContent": "Bạn có chắc chắn muốn đặt lại tất cả lưu lượng cho toàn bộ người dùng không?",
"delDepletedClients": "Xóa các người dùng đã cạn kiệt",
"delDepletedClientsTitle": "Xóa các người dùng đã cạn kiệt",
"delDepletedClientsContent": "Bạn có chắc chắn muốn xóa toàn bộ người dùng đã cạn kiệt không?",
"email": "Email",
"emailDesc": "Vui lòng cung cấp một địa chỉ email duy nhất.",
"IPLimit": "Giới hạn IP",
"IPLimitDesc": "Vô hiệu hóa điểm vào nếu số lượng vượt quá giá trị đã nhập (nhập 0 để vô hiệu hóa giới hạn IP).",
"IPLimitlog": "Lịch sử IP",
"IPLimitlogDesc": "Lịch sử đăng nhập IP (trước khi kích hoạt điểm vào sau khi bị vô hiệu hóa bởi giới hạn IP, bạn nên xóa lịch sử).",
"IPLimitlogclear": "Xóa Lịch sử",
"setDefaultCert": "Đặt chứng chỉ từ bảng điều khiển",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"streamTab": "Stream",
"securityTab": "Bảo mật",
"sniffingTab": "Sniffing",
"sniffingMetadataOnly": "Chỉ siêu dữ liệu",
"sniffingRouteOnly": "Chỉ định tuyến",
"sniffingIpsExcluded": "IP bị loại trừ",
"sniffingDomainsExcluded": "Tên miền bị loại trừ",
"decryption": "Giải mã",
"encryption": "Mã hóa",
"vlessAuthX25519": "Xác thực X25519",
"vlessAuthMlkem768": "Xác thực ML-KEM-768",
"vlessAuthCustom": "Tùy chỉnh",
"vlessAuthSelected": "Đã chọn: {auth}",
"advanced": {
"title": "Các phần JSON của inbound",
"subtitle": "JSON inbound đầy đủ và các trình chỉnh sửa riêng cho settings, sniffing và streamSettings.",
"all": "Tất cả",
"allHelp": "Đối tượng inbound đầy đủ với mọi trường trong một trình chỉnh sửa.",
"settings": "Cài đặt",
"settingsHelp": "Bao đóng khối settings của Xray:",
"sniffing": "Sniffing",
"sniffingHelp": "Bao đóng khối sniffing của Xray:",
"stream": "Stream",
"streamHelp": "Bao đóng khối stream của Xray:",
"jsonErrorPrefix": "JSON nâng cao"
},
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"telegramDesc": "Vui lòng cung cấp ID Trò chuyện Telegram. (sử dụng lệnh '/id' trong bot) hoặc ({'@'}userinfobot)",
"subscriptionDesc": "Bạn có thể tìm liên kết gói đăng ký của mình trong Chi tiết, cũng như bạn có thể sử dụng cùng tên cho nhiều cấu hình khác nhau",
"info": "Thông tin",
"same": "Giống nhau",
"inboundData": "Dữ liệu gửi đến",
"exportInbound": "Xuất nhập khẩu",
"import": "Nhập",
"importInbound": "Nhập inbound",
"periodicTrafficResetTitle": "Đặt lại lưu lượng",
"periodicTrafficResetDesc": "Tự động đặt lại bộ đếm lưu lượng theo khoảng thời gian xác định",
"lastReset": "Đặt lại lần cuối",
"periodicTrafficReset": {
"never": "Không bao giờ",
"daily": "Hàng ngày",
"weekly": "Hàng tuần",
"monthly": "Hàng tháng",
"hourly": "Hàng giờ"
},
"toasts": {
"obtain": "Nhận",
"updateSuccess": "Cập nhật thành công",
"logCleanSuccess": "Đã xóa nhật ký",
"inboundsUpdateSuccess": "Đã cập nhật thành công các kết nối inbound",
"inboundUpdateSuccess": "Đã cập nhật thành công kết nối inbound",
"inboundCreateSuccess": "Đã tạo thành công kết nối inbound",
"inboundDeleteSuccess": "Đã xóa thành công kết nối inbound",
"inboundClientAddSuccess": "Đã thêm client inbound",
"inboundClientDeleteSuccess": "Đã xóa client inbound",
"inboundClientUpdateSuccess": "Đã cập nhật client inbound",
"delDepletedClientsSuccess": "Đã xóa tất cả client hết hạn",
"resetAllClientTrafficSuccess": "Đã đặt lại toàn bộ lưu lượng client",
"resetAllTrafficSuccess": "Đã đặt lại toàn bộ lưu lượng",
"resetInboundClientTrafficSuccess": "Đã đặt lại lưu lượng",
fix: single inbound traffic reset resets all inbounds (#4334) (#4338)
2026-05-13 12:49:54 +00:00
"resetInboundTrafficSuccess": "Đã đặt lại lưu lượng Inbound",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"trafficGetError": "Lỗi khi lấy thông tin lưu lượng",
"getNewX25519CertError": "Lỗi khi lấy chứng chỉ X25519.",
"getNewmldsa65Error": "Lỗi khi lấy chứng chỉ mldsa65.",
"getNewVlessEncError": "Lỗi khi lấy chứng chỉ VlessEnc."
},
"stream": {
"general": {
"request": "Lời yêu cầu",
"response": "Phản ứng",
"name": "Tên",
"value": "Giá trị"
},
"tcp": {
"version": "Phiên bản",
"method": "Phương pháp",
"path": "Đường dẫn",
"status": "Trạng thái",
"statusDescription": "Tình trạng Mô tả",
"requestHeader": "Header yêu cầu",
"responseHeader": "Header phản hồi"
}
}
},
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"clients": {
"add": "Thêm khách hàng",
"edit": "Chỉnh sửa khách hàng",
"submitAdd": "Thêm khách hàng",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"submitEdit": "Lưu thay đổi",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"clientCount": "Số lượng khách hàng",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"bulk": "Thêm hàng loạt",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"copyFromInbound": "Sao chép khách hàng từ inbound",
"copyToInbound": "Sao chép khách hàng đến",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"copySelected": "Sao chép đã chọn",
"copySource": "Nguồn",
"copyEmailPreview": "Xem trước email kết quả",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"copySelectSourceFirst": "Hãy chọn inbound nguồn trước.",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"copyResult": "Kết quả sao chép",
"copyResultSuccess": "Đã sao chép thành công",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"copyResultNone": "Không có gì để sao chép: chưa chọn khách hàng hoặc nguồn rỗng",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"copyResultErrors": "Lỗi sao chép",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"copyFlowLabel": "Flow cho khách hàng mới (VLESS)",
"copyFlowHint": "Áp dụng cho tất cả khách hàng được sao chép. Để trống để bỏ qua.",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"selectAll": "Chọn tất cả",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"clearAll": "Xóa tất cả",
"method": "Phương thức",
"first": "Đầu",
"last": "Cuối",
"ipLog": "Nhật ký IP",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"prefix": "Tiền tố",
"postfix": "Hậu tố",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"delayedStart": "Bắt đầu sau lần dùng đầu",
"expireDays": "Thời hạn",
"days": "Ngày",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"renew": "Tự động gia hạn",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"renewDesc": "Tự động gia hạn sau khi hết hạn. (0 = tắt) (đơn vị: ngày)",
"title": "Khách hàng",
"actions": "Hành động",
"totalGB": "Tổng gửi/nhận (GB)",
"expiryTime": "Hết hạn",
"addClients": "Thêm khách hàng",
"limitIp": "Giới hạn IP",
"password": "Mật khẩu",
"subId": "ID đăng ký",
"online": "Trực tuyến",
"email": "Email",
"comment": "Ghi chú",
"traffic": "Lưu lượng",
"offline": "Ngoại tuyến",
"addTitle": "Thêm khách hàng",
"qrCode": "Mã QR",
"moreInformation": "Thông tin thêm",
"delete": "Xóa",
"reset": "Đặt lại lưu lượng",
"editTitle": "Chỉnh sửa khách hàng",
"client": "Khách hàng",
"enabled": "Đã bật",
"remaining": "Còn lại",
"duration": "Thời hạn",
"attachedInbounds": "Inbound đã gắn",
"selectInbound": "Chọn một hoặc nhiều inbound",
"noSubId": "Khách hàng này không có subId, không có liên kết chia sẻ.",
"noLinks": "Không có liên kết chia sẻ — hãy gắn khách hàng này vào một inbound có giao thức tương thích trước.",
"link": "Liên kết",
"resetNotPossible": "Hãy gắn khách hàng này vào một inbound trước.",
"general": "Chung",
"resetAllTraffics": "Đặt lại lưu lượng của tất cả khách hàng",
"resetAllTrafficsTitle": "Đặt lại lưu lượng của tất cả khách hàng?",
"resetAllTrafficsContent": "Bộ đếm gửi/nhận của mỗi khách hàng về 0. Hạn mức và thời hạn không bị ảnh hưởng. Không thể hoàn tác.",
"empty": "Chưa có khách hàng nào — thêm một để bắt đầu.",
"deleteConfirmTitle": "Xóa khách hàng {email}?",
"deleteConfirmContent": "Hành động này gỡ khách hàng khỏi mọi inbound đã gắn và xóa bản ghi lưu lượng. Không thể hoàn tác.",
"deleteSelected": "Xóa ({count})",
Bulk extend client expiry / traffic + clients page polish (#4499) * chore(sub): drop unused getFallbackMaster projectThroughFallbackMaster fully supersedes it for both panel-tracked and legacy unix-socket fallbacks. * feat(clients): bulk extend expiry / traffic for selected clients Adds POST /panel/api/clients/bulkAdjust which shifts ExpiryTime by addDays and TotalGB by addBytes for every email in one request. The endpoint is wired into the clients page through a new ClientBulkAdjustModal that opens from the existing multi-select toolbar. Clients with unlimited expiry (expiryTime=0) or unlimited traffic (totalGB=0) are skipped for the corresponding field so bulk extend never accidentally converts an unlimited client to a limited one. Negative values are allowed for refunds / corrections. Translations added for all 13 locales. * fix(db): silence GORM record-not-found spam in debug mode getSetting handles ErrRecordNotFound via database.IsNotFound and falls back to defaults, but GORM's Default logger still logs each miss as an error. With periodic jobs reading unset keys (xrayTemplateConfig, externalTrafficInformEnable) the panel log flooded thousands of times. Switch to a logger.New with IgnoreRecordNotFoundError=true so legitimate slow-query and SQL traces still surface in debug mode. * fix(clients): include inboundsById in columns memo deps Without it, the table's first paint captured an empty inboundsById and rendered each attached inbound as #<id>. Once a sort/filter forced the memo to rebuild it self-corrected, hence the visible flicker on reload. * fix(clients): handle delayed-start expiry in bulk adjust Negative ExpiryTime encodes a delay duration (magnitude = ms until the trial begins on first use). Adding positive addDays was simply arithmetically added, so e.g. a -7d delay + 30d turned into +23d since epoch (1970), making the client instantly expired. Branch on sign now: positive ExpiryTime extends additively, negative extends by subtracting so the value stays negative (more delay). Cross-sign reductions are skipped with an explicit reason instead of silently corrupting the field. * fix(clients): step traffic input by 1 GB instead of 0.1 The +/- buttons on the Total Sent/Received field nudged in 0.1 GB increments which is too granular for typical use. Set step=1 so each press moves a whole GB; users can still type decimal values directly. * fix(inbounds): step Total Flow input by 1 GB instead of 0.1 Matches the same nudge fix applied to the client form's Total Sent/Received field.
2026-05-23 14:27:20 +00:00
"adjustSelected": "Điều chỉnh ({count})",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"bulkDeleteConfirmTitle": "Xóa {count} khách hàng?",
"bulkDeleteConfirmContent": "Mỗi khách hàng được chọn sẽ bị gỡ khỏi tất cả inbound đã gắn và bản ghi lưu lượng cũng bị xóa. Không thể hoàn tác.",
Bulk extend client expiry / traffic + clients page polish (#4499) * chore(sub): drop unused getFallbackMaster projectThroughFallbackMaster fully supersedes it for both panel-tracked and legacy unix-socket fallbacks. * feat(clients): bulk extend expiry / traffic for selected clients Adds POST /panel/api/clients/bulkAdjust which shifts ExpiryTime by addDays and TotalGB by addBytes for every email in one request. The endpoint is wired into the clients page through a new ClientBulkAdjustModal that opens from the existing multi-select toolbar. Clients with unlimited expiry (expiryTime=0) or unlimited traffic (totalGB=0) are skipped for the corresponding field so bulk extend never accidentally converts an unlimited client to a limited one. Negative values are allowed for refunds / corrections. Translations added for all 13 locales. * fix(db): silence GORM record-not-found spam in debug mode getSetting handles ErrRecordNotFound via database.IsNotFound and falls back to defaults, but GORM's Default logger still logs each miss as an error. With periodic jobs reading unset keys (xrayTemplateConfig, externalTrafficInformEnable) the panel log flooded thousands of times. Switch to a logger.New with IgnoreRecordNotFoundError=true so legitimate slow-query and SQL traces still surface in debug mode. * fix(clients): include inboundsById in columns memo deps Without it, the table's first paint captured an empty inboundsById and rendered each attached inbound as #<id>. Once a sort/filter forced the memo to rebuild it self-corrected, hence the visible flicker on reload. * fix(clients): handle delayed-start expiry in bulk adjust Negative ExpiryTime encodes a delay duration (magnitude = ms until the trial begins on first use). Adding positive addDays was simply arithmetically added, so e.g. a -7d delay + 30d turned into +23d since epoch (1970), making the client instantly expired. Branch on sign now: positive ExpiryTime extends additively, negative extends by subtracting so the value stays negative (more delay). Cross-sign reductions are skipped with an explicit reason instead of silently corrupting the field. * fix(clients): step traffic input by 1 GB instead of 0.1 The +/- buttons on the Total Sent/Received field nudged in 0.1 GB increments which is too granular for typical use. Set step=1 so each press moves a whole GB; users can still type decimal values directly. * fix(inbounds): step Total Flow input by 1 GB instead of 0.1 Matches the same nudge fix applied to the client form's Total Sent/Received field.
2026-05-23 14:27:20 +00:00
"bulkAdjustTitle": "Điều chỉnh {count} khách hàng",
"bulkAdjustHint": "Giá trị dương kéo dài, giá trị âm rút ngắn. Khách hàng có hạn hoặc lưu lượng không giới hạn sẽ bị bỏ qua cho trường đó.",
"bulkAdjustNothing": "Đặt số ngày hoặc lưu lượng trước khi áp dụng.",
"addDays": "Thêm ngày",
"addTrafficGB": "Thêm lưu lượng (GB)",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"delDepleted": "Xóa hết hạn mức",
"delDepletedConfirmTitle": "Xóa khách hàng hết hạn mức?",
"delDepletedConfirmContent": "Gỡ tất cả khách hàng đã dùng hết hạn mức lưu lượng hoặc đã quá hạn. Không thể hoàn tác.",
"auth": "Auth",
"hysteriaAuth": "Auth Hysteria",
"uuid": "UUID",
"flow": "Flow",
"reverseTag": "Reverse tag",
"reverseTagPlaceholder": "Reverse tag tùy chọn",
"telegramId": "ID người dùng Telegram",
"telegramIdPlaceholder": "ID người dùng Telegram dạng số (0 = không có)",
"created": "Tạo",
"updated": "Cập nhật",
"ipLimit": "Giới hạn IP",
"toasts": {
"deleted": "Đã xóa khách hàng",
"trafficReset": "Đã đặt lại lưu lượng",
"allTrafficsReset": "Đã đặt lại lưu lượng của tất cả khách hàng",
"bulkDeleted": "Đã xóa {count} khách hàng",
"bulkDeletedMixed": "Đã xóa {ok}, thất bại {failed}",
"bulkCreated": "Đã tạo {count} khách hàng",
"bulkCreatedMixed": "Đã tạo {ok}, thất bại {failed}",
Bulk extend client expiry / traffic + clients page polish (#4499) * chore(sub): drop unused getFallbackMaster projectThroughFallbackMaster fully supersedes it for both panel-tracked and legacy unix-socket fallbacks. * feat(clients): bulk extend expiry / traffic for selected clients Adds POST /panel/api/clients/bulkAdjust which shifts ExpiryTime by addDays and TotalGB by addBytes for every email in one request. The endpoint is wired into the clients page through a new ClientBulkAdjustModal that opens from the existing multi-select toolbar. Clients with unlimited expiry (expiryTime=0) or unlimited traffic (totalGB=0) are skipped for the corresponding field so bulk extend never accidentally converts an unlimited client to a limited one. Negative values are allowed for refunds / corrections. Translations added for all 13 locales. * fix(db): silence GORM record-not-found spam in debug mode getSetting handles ErrRecordNotFound via database.IsNotFound and falls back to defaults, but GORM's Default logger still logs each miss as an error. With periodic jobs reading unset keys (xrayTemplateConfig, externalTrafficInformEnable) the panel log flooded thousands of times. Switch to a logger.New with IgnoreRecordNotFoundError=true so legitimate slow-query and SQL traces still surface in debug mode. * fix(clients): include inboundsById in columns memo deps Without it, the table's first paint captured an empty inboundsById and rendered each attached inbound as #<id>. Once a sort/filter forced the memo to rebuild it self-corrected, hence the visible flicker on reload. * fix(clients): handle delayed-start expiry in bulk adjust Negative ExpiryTime encodes a delay duration (magnitude = ms until the trial begins on first use). Adding positive addDays was simply arithmetically added, so e.g. a -7d delay + 30d turned into +23d since epoch (1970), making the client instantly expired. Branch on sign now: positive ExpiryTime extends additively, negative extends by subtracting so the value stays negative (more delay). Cross-sign reductions are skipped with an explicit reason instead of silently corrupting the field. * fix(clients): step traffic input by 1 GB instead of 0.1 The +/- buttons on the Total Sent/Received field nudged in 0.1 GB increments which is too granular for typical use. Set step=1 so each press moves a whole GB; users can still type decimal values directly. * fix(inbounds): step Total Flow input by 1 GB instead of 0.1 Matches the same nudge fix applied to the client form's Total Sent/Received field.
2026-05-23 14:27:20 +00:00
"bulkAdjusted": "Đã điều chỉnh {count} khách hàng",
"bulkAdjustedMixed": "Đã điều chỉnh {ok}, bỏ qua {skipped}",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"delDepleted": "Đã xóa {count} khách hàng hết hạn mức"
}
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
},
"nodes": {
"title": "Nút",
"addNode": "Thêm nút",
"editNode": "Chỉnh sửa nút",
"totalNodes": "Tổng số nút",
"onlineNodes": "Trực tuyến",
"offlineNodes": "Ngoại tuyến",
"avgLatency": "Độ trễ trung bình",
"name": "Tên",
"namePlaceholder": "vd: de-frankfurt-1",
"addressPlaceholder": "panel.example.com hoặc 1.2.3.4",
"remark": "Chú thích",
"scheme": "Giao thức",
"address": "Địa chỉ",
"port": "Cổng",
"basePath": "Đường dẫn cơ sở",
"apiToken": "Token API",
"apiTokenPlaceholder": "Token từ trang Cài đặt của panel từ xa",
"apiTokenHint": "Panel từ xa hiển thị token API tại Cài đặt → Token API.",
"regenerate": "Tạo lại token",
"regenerateConfirm": "Tạo lại sẽ vô hiệu hóa token hiện tại. Mọi panel trung tâm dùng nó sẽ mất quyền truy cập cho đến khi được cập nhật. Tiếp tục?",
fix: add i18n translations for Allow private address node option across all locales (#4386) * fix: add Chinese locale translations for Allow private address node option * fix: add Allow private address translations to all remaining locale files
2026-05-15 07:51:14 +00:00
"allowPrivateAddress": "Cho phép địa chỉ riêng",
"allowPrivateAddressHint": "Chỉ bật cho các nút trên mạng riêng hoặc VPN.",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"enable": "Kích hoạt",
"status": "Trạng thái",
"cpu": "CPU",
"mem": "Bộ nhớ",
"uptime": "Thời gian hoạt động",
"latency": "Độ trễ",
"lastHeartbeat": "Heartbeat gần nhất",
"xrayVersion": "Phiên bản Xray",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"panelVersion": "Phiên bản panel",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"actions": "Hành động",
"probe": "Kiểm tra ngay",
"testConnection": "Kiểm tra kết nối",
"connectionOk": "Kết nối OK ({ms} ms)",
"connectionFailed": "Kết nối thất bại",
"never": "chưa bao giờ",
"justNow": "vừa xong",
"deleteConfirmTitle": "Xóa nút \"{name}\"?",
"deleteConfirmContent": "Việc này dừng giám sát nút. Panel từ xa không bị ảnh hưởng.",
"statusValues": {
"online": "Trực tuyến",
"offline": "Ngoại tuyến",
"unknown": "Không xác định"
},
"toasts": {
"list": "Không tải được danh sách nút",
"obtain": "Không tải được nút",
"add": "Thêm nút",
"update": "Cập nhật nút",
"delete": "Xóa nút",
"deleted": "Đã xóa nút",
"test": "Kiểm tra kết nối",
"fillRequired": "Tên, địa chỉ, cổng và token API là bắt buộc",
"probeFailed": "Kiểm tra thất bại"
}
},
"settings": {
"title": "Cài đặt",
"save": "Lưu",
"infoDesc": "Mọi thay đổi được thực hiện ở đây cần phải được lưu. Vui lòng khởi động lại bảng điều khiển để áp dụng các thay đổi.",
"restartPanel": "Khởi động lại bảng điều khiển",
"restartPanelDesc": "Bạn có chắc chắn muốn khởi động lại bảng điều khiển? Nhấn OK để khởi động lại sau 3 giây. Nếu bạn không thể truy cập bảng điều khiển sau khi khởi động lại, vui lòng xem thông tin nhật ký của bảng điều khiển trên máy chủ.",
"restartPanelSuccess": "Đã khởi động lại bảng điều khiển thành công",
"actions": "Hành động",
"resetDefaultConfig": "Đặt lại cấu hình mặc định",
"panelSettings": "Bảng điều khiển",
"securitySettings": "Bảo mật",
i18n: translate hardcoded inbound action + security warning strings (#4502) The inbound row actions (delete / reset traffic / clone / export links / export subscription links / show JSON / export-all variants) and the security warning alert on the Settings page were emitting English text directly. Replace them with i18n keys and add translations across all 13 supported locales.
2026-05-23 17:43:21 +00:00
"securityWarnings": "Cảnh báo bảo mật",
"panelExposed": "Bảng điều khiển của bạn có thể bị lộ:",
"warnHttp": "Panel đang chạy trên HTTP thuần — thiết lập TLS cho môi trường thật.",
"warnDefaultPort": "Cổng mặc định 2053 đã quá phổ biến — đổi sang cổng ngẫu nhiên.",
"warnDefaultBasePath": "Đường dẫn cơ sở mặc định \"/\" đã quá phổ biến — đổi sang đường dẫn ngẫu nhiên.",
"warnDefaultSubPath": "Đường dẫn đăng ký mặc định \"/sub/\" đã quá phổ biến — đổi nó.",
"warnDefaultJsonPath": "Đường dẫn đăng ký JSON mặc định \"/json/\" đã quá phổ biến — đổi nó.",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"TGBotSettings": "Bot Telegram",
"panelListeningIP": "IP Nghe của bảng điều khiển",
"panelListeningIPDesc": "Mặc định để trống để nghe tất cả các IP.",
"panelListeningDomain": "Tên miền của nghe bảng điều khiển",
"panelListeningDomainDesc": "Mặc định để trống để nghe tất cả các tên miền và IP",
"panelPort": "Cổng bảng điều khiển",
"panelPortDesc": "Cổng được sử dụng để kết nối với bảng điều khiển này",
"publicKeyPath": "Đường dẫn file chứng chỉ bảng điều khiển",
"publicKeyPathDesc": "Điền vào đường dẫn đầy đủ (bắt đầu từ '/')",
"privateKeyPath": "Đường dẫn file khóa của chứng chỉ bảng điều khiển",
"privateKeyPathDesc": "Điền vào đường dẫn đầy đủ (bắt đầu từ '/')",
"panelUrlPath": "Đường dẫn gốc URL bảng điều khiển",
"panelUrlPathDesc": "Phải bắt đầu và kết thúc bằng '/'",
"pageSize": "Kích thước phân trang",
"pageSizeDesc": "Xác định kích thước trang cho bảng gửi đến. Đặt 0 để tắt",
"remarkModel": "Ghi chú mô hình và ký tự phân tách",
"datepicker": "Kiểu lịch",
"datepickerPlaceholder": "Chọn ngày",
"datepickerDescription": "Tác vụ chạy theo lịch trình sẽ chạy theo kiểu lịch này.",
"sampleRemark": "Nhận xét mẫu",
"oldUsername": "Tên người dùng hiện tại",
"currentPassword": "Mật khẩu hiện tại",
"newUsername": "Tên người dùng mới",
"newPassword": "Mật khẩu mới",
"telegramBotEnable": "Bật Bot Telegram",
"telegramBotEnableDesc": "Kết nối với các tính năng của bảng điều khiển này thông qua bot Telegram",
"telegramToken": "Token Telegram",
"telegramTokenDesc": "Bạn phải nhận token từ quản lý bot Telegram {'@'}botfather",
"telegramProxy": "Socks5 Proxy",
"telegramProxyDesc": "Nếu bạn cần socks5 proxy để kết nối với Telegram. Điều chỉnh cài đặt của nó theo hướng dẫn.",
"telegramAPIServer": "Telegram API Server",
"telegramAPIServerDesc": "Máy chủ API Telegram để sử dụng. Để trống để sử dụng máy chủ mặc định.",
"telegramChatId": "Chat ID Telegram của quản trị viên",
"telegramChatIdDesc": "Nhiều Chat ID phân tách bằng dấu phẩy. Sử dụng {'@'}userinfobot hoặc sử dụng lệnh '/id' trong bot để lấy Chat ID của bạn.",
"telegramNotifyTime": "Thời gian thông báo của bot Telegram",
"telegramNotifyTimeDesc": "Sử dụng định dạng thời gian Crontab.",
"tgNotifyBackup": "Sao lưu Cơ sở dữ liệu",
"tgNotifyBackupDesc": "Bao gồm tệp sao lưu cơ sở dữ liệu với thông báo báo cáo.",
"tgNotifyLogin": "Thông báo Đăng nhập",
"tgNotifyLoginDesc": "Hiển thị tên người dùng, địa chỉ IP và thời gian khi ai đó cố gắng đăng nhập vào bảng điều khiển của bạn.",
"sessionMaxAge": "Thời gian tối đa của phiên",
"sessionMaxAgeDesc": "Thời gian của phiên đăng nhập (đơn vị: phút)",
"expireTimeDiff": "Ngưỡng hết hạn cho thông báo",
"expireTimeDiffDesc": "Nhận thông báo về việc hết hạn tài khoản trước ngưỡng này (đơn vị: ngày)",
"trafficDiff": "Ngưỡng lưu lượng cho thông báo",
"trafficDiffDesc": "Nhận thông báo về việc cạn kiệt lưu lượng trước khi đạt đến ngưỡng này (đơn vị: GB)",
"tgNotifyCpu": "Ngưỡng cảnh báo tỷ lệ CPU",
"tgNotifyCpuDesc": "Nhận thông báo nếu tỷ lệ sử dụng CPU vượt quá ngưỡng này (đơn vị: %)",
"timeZone": "Múi giờ",
"timeZoneDesc": "Các tác vụ được lên lịch chạy theo thời gian trong múi giờ này.",
"subSettings": "Gói đăng ký",
"subEnable": "Bật dịch vụ",
"subEnableDesc": "Tính năng gói đăng ký với cấu hình riêng",
"subJsonEnable": "Bật/Tắt điểm cuối đăng ký JSON độc lập.",
"subTitle": "Tiêu đề Đăng ký",
"subTitleDesc": "Tiêu đề hiển thị trong ứng dụng VPN",
"subSupportUrl": "URL Hỗ trợ",
"subSupportUrlDesc": "Liên kết hỗ trợ kỹ thuật hiển thị trong ứng dụng VPN",
"subProfileUrl": "URL Hồ sơ",
"subProfileUrlDesc": "Liên kết đến trang web của bạn hiển thị trong ứng dụng VPN",
"subAnnounce": "Thông báo",
"subAnnounceDesc": "Văn bản thông báo hiển thị trong ứng dụng VPN",
"subEnableRouting": "Bật định tuyến",
"subEnableRoutingDesc": "Cài đặt toàn cục để bật định tuyến trong ứng dụng khách VPN. (Chỉ dành cho Happ)",
"subRoutingRules": "Quy tắc định tuyến",
"subRoutingRulesDesc": "Quy tắc định tuyến toàn cầu cho client VPN. (Chỉ dành cho Happ)",
"subListen": "Listening IP",
"subListenDesc": "Mặc định để trống để nghe tất cả các IP",
"subPort": "Cổng gói đăng ký",
"subPortDesc": "Số cổng dịch vụ đăng ký phải chưa được sử dụng trên máy chủ",
"subCertPath": "Đường dẫn file chứng chỉ gói đăng ký",
"subCertPathDesc": "Điền vào đường dẫn đầy đủ (bắt đầu với '/')",
"subKeyPath": "Đường dẫn file khóa của chứng chỉ gói đăng ký",
"subKeyPathDesc": "Điền vào đường dẫn đầy đủ (bắt đầu với '/')",
"subPath": "Đường dẫn gốc URL gói đăng ký",
"subPathDesc": "Phải bắt đầu và kết thúc bằng '/'",
"subDomain": "Tên miền con",
"subDomainDesc": "Mặc định để trống để nghe tất cả các tên miền và IP",
"subUpdates": "Khoảng thời gian cập nhật gói đăng ký",
"subUpdatesDesc": "Số giờ giữa các cập nhật trong ứng dụng khách",
"subEncrypt": "Mã hóa cấu hình",
"subEncryptDesc": "Mã hóa các cấu hình được trả về trong gói đăng ký",
"subShowInfo": "Hiển thị thông tin sử dụng",
"subShowInfoDesc": "Hiển thị lưu lượng truy cập còn lại và ngày sau tên cấu hình",
Add possibility to remove client email from sub (#4297)
2026-05-13 17:04:17 +00:00
"subEmailInRemark": "Thêm Email vào tên",
"subEmailInRemarkDesc": "Thêm email của client vào tên hồ sơ đăng ký.",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"subURI": "URI proxy trung gian",
"subURIDesc": "Thay đổi URI cơ sở của URL gói đăng ký để sử dụng cho proxy trung gian",
"externalTrafficInformEnable": "Thông báo giao thông bên ngoài",
"externalTrafficInformEnableDesc": "Thông báo cho API bên ngoài về mọi cập nhật lưu lượng truy cập.",
"externalTrafficInformURI": "URI thông báo lưu lượng truy cập bên ngoài",
"externalTrafficInformURIDesc": "Cập nhật lưu lượng truy cập được gửi tới URI này.",
"restartXrayOnClientDisable": "Khởi Động Lại Xray Sau Khi Tự Động Vô Hiệu Hóa",
"restartXrayOnClientDisableDesc": "Khi người dùng bị vô hiệu hóa tự động do hết hạn hoặc chạm giới hạn lưu lượng, hãy khởi động lại Xray.",
"fragment": "Sự phân mảnh",
"fragmentDesc": "Kích hoạt phân mảnh cho gói TLS hello",
"fragmentSett": "Cài đặt phân mảnh",
"noisesDesc": "Bật Noises.",
"noisesSett": "Cài đặt Noises",
"mux": "Mux",
"muxDesc": "Truyền nhiều luồng dữ liệu độc lập trong luồng dữ liệu đã thiết lập.",
"muxSett": "Mux Cài đặt",
"direct": "Kết nối trực tiếp",
"directDesc": "Trực tiếp thiết lập kết nối với tên miền hoặc dải IP của một quốc gia cụ thể.",
"notifications": "Thông báo",
"certs": "Chứng chỉ",
"externalTraffic": "Lưu lượng bên ngoài",
"dateAndTime": "Ngày và giờ",
"proxyAndServer": "Proxy và máy chủ",
"intervals": "Khoảng thời gian",
"information": "Thông tin",
"language": "Ngôn ngữ",
"telegramBotLanguage": "Ngôn ngữ của Bot Telegram",
"security": {
"admin": "Thông tin đăng nhập quản trị viên",
"twoFactor": "Xác thực hai yếu tố",
"twoFactorEnable": "Bật 2FA",
"twoFactorEnableDesc": "Thêm một lớp bảo mật bổ sung để tăng cường an toàn.",
"twoFactorModalSetTitle": "Bật xác thực hai yếu tố",
"twoFactorModalDeleteTitle": "Tắt xác thực hai yếu tố",
"twoFactorModalSteps": "Để thiết lập xác thực hai yếu tố, hãy thực hiện các bước sau:",
"twoFactorModalFirstStep": "1. Quét mã QR này trong ứng dụng xác thực hoặc sao chép mã token gần mã QR và dán vào ứng dụng",
"twoFactorModalSecondStep": "2. Nhập mã từ ứng dụng",
"twoFactorModalRemoveStep": "Nhập mã từ ứng dụng để xóa xác thực hai yếu tố.",
"twoFactorModalChangeCredentialsTitle": "Thay đổi thông tin xác thực",
"twoFactorModalChangeCredentialsStep": "Nhập mã từ ứng dụng để thay đổi thông tin xác thực quản trị viên.",
"twoFactorModalSetSuccess": "Xác thực hai yếu tố đã được thiết lập thành công",
"twoFactorModalDeleteSuccess": "Xác thực hai yếu tố đã được xóa thành công",
feat(api-tokens): manage multiple named tokens; add tab/section anchor URLs Replace the single regenerable API token with a named-token list: - New ApiToken model + service with constant-time auth matching - Seeder migrates the legacy `apiToken` setting into a "default" row - Security tab gets create/enable/delete UI; api-docs page links to it - Dedicated "API Tokens" section in the in-panel docs URL anchors now reflect the active tab/section on Settings, Xray, and API Docs pages, so deep links like `/panel/settings#security` work. Translations for the 8 new SecurityTab strings added across all locales.
2026-05-13 14:34:31 +00:00
"twoFactorModalError": "Mã sai",
"show": "Hiển thị",
"hide": "Ẩn",
"apiTokenNew": "Token mới",
"apiTokenName": "Tên",
"apiTokenNamePlaceholder": "ví dụ: central-panel-a",
"apiTokenNameRequired": "Tên là bắt buộc",
"apiTokenEmpty": "Chưa có token nào — tạo một token để xác thực bot hoặc panel từ xa.",
"apiTokenDeleteWarning": "Mọi client đang dùng token này sẽ ngừng xác thực ngay lập tức."
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
},
"toasts": {
"modifySettings": "Các tham số đã được thay đổi.",
"getSettings": "Lỗi xảy ra khi truy xuất tham số.",
"modifyUserError": "Đã xảy ra lỗi khi thay đổi thông tin đăng nhập quản trị viên.",
"modifyUser": "Bạn đã thay đổi thông tin đăng nhập quản trị viên thành công.",
"originalUserPassIncorrect": "Tên người dùng hoặc mật khẩu gốc không đúng",
"userPassMustBeNotEmpty": "Tên người dùng mới và mật khẩu mới không thể để trống",
"getOutboundTrafficError": "Lỗi khi lấy lưu lượng truy cập đi",
"resetOutboundTrafficError": "Lỗi khi đặt lại lưu lượng truy cập đi"
}
},
"xray": {
"title": "Cài đặt Xray",
"save": "Lưu cài đặt",
"restart": "Khởi động lại Xray",
"restartSuccess": "Đã khởi động lại Xray thành công",
"stopSuccess": "Xray đã được dừng thành công",
"restartError": "Đã xảy ra lỗi khi khởi động lại Xray.",
"stopError": "Đã xảy ra lỗi khi dừng Xray.",
"basicTemplate": "Mẫu Cơ bản",
"advancedTemplate": "Mẫu Nâng cao",
"generalConfigs": "Cấu hình Chung",
"generalConfigsDesc": "Những tùy chọn này sẽ cung cấp điều chỉnh tổng quát.",
"logConfigs": "Nhật ký",
"logConfigsDesc": "Nhật ký có thể ảnh hưởng đến hiệu suất máy chủ của bạn. Bạn chỉ nên kích hoạt nó một cách khôn ngoan trong trường hợp bạn cần",
"blockConfigsDesc": "Những tùy chọn này sẽ ngăn người dùng kết nối đến các giao thức và trang web cụ thể.",
"basicRouting": "Định tuyến Cơ bản",
"blockConnectionsConfigsDesc": "Các tùy chọn này sẽ chặn lưu lượng truy cập dựa trên quốc gia được yêu cầu cụ thể.",
"directConnectionsConfigsDesc": "Kết nối trực tiếp đảm bảo rằng lưu lượng truy cập cụ thể không được định tuyến qua máy chủ khác.",
"blockips": "Chặn IP",
"blockdomains": "Chặn Tên Miền",
"directips": "IP Trực Tiếp",
"directdomains": "Tên Miền Trực Tiếp",
"ipv4Routing": "Định tuyến IPv4",
"ipv4RoutingDesc": "Những tùy chọn này sẽ chỉ định kết nối đến các tên miền mục tiêu qua IPv4.",
"warpRouting": "Định tuyến WARP",
"warpRoutingDesc": "Cảnh báo: Trước khi sử dụng những tùy chọn này, hãy cài đặt WARP ở chế độ proxy socks5 trên máy chủ của bạn bằng cách làm theo các bước trên GitHub của bảng điều khiển. WARP sẽ định tuyến lưu lượng đến các trang web qua máy chủ Cloudflare.",
"nordRouting": "Định tuyến NordVPN",
"nordRoutingDesc": "Các tùy chọn này sẽ định tuyến lưu lượng dựa trên đích cụ thể qua NordVPN.",
"Template": "Mẫu Cấu hình Xray",
"TemplateDesc": "Tạo tệp cấu hình Xray cuối cùng dựa trên mẫu này.",
"FreedomStrategy": "Cấu hình Chiến lược cho Giao thức Freedom",
"FreedomStrategyDesc": "Đặt chiến lược đầu ra của mạng trong Giao thức Freedom.",
"RoutingStrategy": "Cấu hình Chiến lược Định tuyến Tên miền",
"RoutingStrategyDesc": "Đặt chiến lược định tuyến tổng thể cho việc giải quyết DNS.",
"outboundTestUrl": "URL kiểm tra outbound",
"outboundTestUrlDesc": "URL dùng khi kiểm tra kết nối outbound",
"Torrent": "Cấu hình sử dụng BitTorrent",
"Inbounds": "Đầu vào",
"InboundsDesc": "Thay đổi mẫu cấu hình để chấp nhận các máy khách cụ thể.",
"Outbounds": "Đầu ra",
"Balancers": "Cân bằng",
"OutboundsDesc": "Thay đổi mẫu cấu hình để xác định các cách ra đi cho máy chủ này.",
"Routings": "Quy tắc định tuyến",
"RoutingsDesc": "Mức độ ưu tiên của mỗi quy tắc đều quan trọng!",
"completeTemplate": "All",
"logLevel": "Mức đăng nhập",
"logLevelDesc": "Cấp độ nhật ký cho nhật ký lỗi, cho biết thông tin cần được ghi lại.",
"accessLog": "Nhật ký truy cập",
"accessLogDesc": "Đường dẫn tệp cho nhật ký truy cập. Nhật ký truy cập bị vô hiệu hóa có giá trị đặc biệt 'không'",
"errorLog": "Nhật ký lỗi",
"errorLogDesc": "Đường dẫn tệp cho nhật ký lỗi. Nhật ký lỗi bị vô hiệu hóa có giá trị đặc biệt 'không'",
"dnsLog": "Nhật ký DNS",
"dnsLogDesc": "Có bật nhật ký truy vấn DNS không",
"maskAddress": "Ẩn Địa Chỉ",
"maskAddressDesc": "Mặt nạ địa chỉ IP, khi được bật, sẽ tự động thay thế địa chỉ IP xuất hiện trong nhật ký.",
"statistics": "Thống kê",
"statsInboundUplink": "Thống kê tải lên đầu vào",
"statsInboundUplinkDesc": "Kích hoạt thu thập thống kê cho lưu lượng tải lên của tất cả các proxy đầu vào.",
"statsInboundDownlink": "Thống kê tải xuống đầu vào",
"statsInboundDownlinkDesc": "Kích hoạt thu thập thống kê cho lưu lượng tải xuống của tất cả các proxy đầu vào.",
"statsOutboundUplink": "Thống kê tải lên đầu ra",
"statsOutboundUplinkDesc": "Kích hoạt thu thập thống kê cho lưu lượng tải lên của tất cả các proxy đầu ra.",
"statsOutboundDownlink": "Thống kê tải xuống đầu ra",
"statsOutboundDownlinkDesc": "Kích hoạt thu thập thống kê cho lưu lượng tải xuống của tất cả các proxy đầu ra.",
"rules": {
"first": "Đầu tiên",
"last": "Cuối cùng",
"up": "Lên",
"down": "Xuống",
"source": "Nguồn",
"dest": "Đích",
"inbound": "Vào",
"outbound": "Ra",
"balancer": "Cân bằng",
"info": "Thông tin",
"add": "Thêm quy tắc",
"edit": "Chỉnh sửa quy tắc",
"useComma": "Các mục được phân tách bằng dấu phẩy"
},
"outbound": {
"addOutbound": "Thêm thư đi",
"addReverse": "Thêm đảo ngược",
"editOutbound": "Chỉnh sửa gửi đi",
"editReverse": "Chỉnh sửa ngược lại",
"reverseTag": "Thẻ Ngược",
"reverseTagDesc": "Thẻ outbound của proxy ngược đơn giản VLESS. Để trống để vô hiệu hóa.",
"reverseTagPlaceholder": "thẻ outbound (để trống để vô hiệu hóa)",
"tag": "Thẻ",
"tagDesc": "thẻ duy nhất",
"address": "Địa chỉ",
"reverse": "Đảo ngược",
"domain": "Miền",
"type": "Loại",
"bridge": "Cầu",
"portal": "Cổng thông tin",
"link": "Liên kết",
"intercon": "Kết nối",
"settings": "cài đặt",
"accountInfo": "Thông tin tài khoản",
"outboundStatus": "Trạng thái đầu ra",
"sendThrough": "Gửi qua",
"test": "Kiểm tra",
"testResult": "Kết quả kiểm tra",
"testing": "Đang kiểm tra kết nối...",
"testSuccess": "Kiểm tra thành công",
"testFailed": "Kiểm tra thất bại",
"testError": "Không thể kiểm tra đầu ra",
"nordvpn": "NordVPN",
"accessToken": "Mã truy cập",
"country": "Quốc gia",
"server": "Máy chủ",
"city": "Thành phố",
"allCities": "Tất cả thành phố",
"privateKey": "Khóa riêng",
"load": "Tải"
},
"balancer": {
"addBalancer": "Thêm cân bằng",
"editBalancer": "Chỉnh sửa cân bằng",
"balancerStrategy": "Chiến lược",
"balancerSelectors": "Bộ chọn",
"tag": "Thẻ",
"tagDesc": "thẻ duy nhất",
"balancerDesc": "Không thể sử dụng balancerTag và outboundTag cùng một lúc. Nếu sử dụng cùng lúc thì chỉ outboundTag mới hoạt động."
},
"wireguard": {
"secretKey": "Khoá bí mật",
"publicKey": "Khóa công khai",
"allowedIPs": "IP được phép",
"endpoint": "Điểm cuối",
"psk": "Khóa chia sẻ",
"domainStrategy": "Chiến lược tên miền"
},
"tun": {
"nameDesc": "Tên của giao diện TUN. Giá trị mặc định là 'xray0'",
"mtuDesc": "Đơn vị Truyền Tối đa. Kích thước tối đa của các gói dữ liệu. Giá trị mặc định là 1500",
"userLevel": "Mức Người Dùng",
"userLevelDesc": "Tất cả các kết nối được thực hiện thông qua inbound này sẽ sử dụng mức người dùng này. Giá trị mặc định là 0"
},
"dns": {
"enable": "Kích hoạt DNS",
"enableDesc": "Kích hoạt máy chủ DNS tích hợp",
"tag": "Thẻ gửi đến DNS",
"tagDesc": "Thẻ này sẽ có sẵn dưới dạng thẻ Gửi đến trong quy tắc định tuyến.",
"clientIp": "IP khách hàng",
"clientIpDesc": "Được sử dụng để thông báo cho máy chủ về vị trí IP được chỉ định trong các truy vấn DNS",
"disableCache": "Tắt bộ nhớ đệm",
"disableCacheDesc": "Tắt bộ nhớ đệm DNS",
"disableFallback": "Tắt Fallback",
"disableFallbackDesc": "Tắt các truy vấn DNS Fallback",
"disableFallbackIfMatch": "Tắt Fallback Nếu Khớp",
"disableFallbackIfMatchDesc": "Tắt các truy vấn DNS Fallback khi danh sách tên miền khớp của máy chủ DNS được kích hoạt",
"enableParallelQuery": "Bật Truy vấn Song song",
"enableParallelQueryDesc": "Bật truy vấn DNS song song đến nhiều máy chủ để phân giải nhanh hơn",
"strategy": "Chiến lược truy vấn",
"strategyDesc": "Chiến lược tổng thể để phân giải tên miền",
"add": "Thêm máy chủ",
"edit": "Chỉnh sửa máy chủ",
"domains": "Tên miền",
"expectIPs": "Các IP Dự Kiến",
"unexpectIPs": "IP không mong muốn",
"useSystemHosts": "Sử dụng Hosts hệ thống",
"useSystemHostsDesc": "Sử dụng file hosts từ hệ thống đã cài đặt",
feat(xray/dns): align DNS settings with Xray docs + UI polish - DNS server modal: rename expectIPs -> expectedIPs (per docs); add per-server tag, clientIP, serveStale, serveExpiredTTL, timeoutMs; flip skipFallback default to false; hydration still accepts legacy expectIPs for back-compat. - DNS tab: add hosts editor (domain -> IP/array), serveStale + serveExpiredTTL controls, "Use Preset" button bringing back the legacy preset gallery (Google / Cloudflare / AdGuard + Family variants — fixed AdGuard Family IPs that were wrong in legacy), and a "Delete All" button to wipe the server list at once. - i18n: add 15 new dns.* keys across all 13 locales. - Frontend-wide formatter pass on Vue components (whitespace and attribute layout only, no behavior changes). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-10 15:03:11 +00:00
"serveStale": "Phục vụ kết quả hết hạn",
"serveStaleDesc": "Trả về kết quả cache đã hết hạn trong khi làm mới ở chế độ nền",
"serveExpiredTTL": "TTL hết hạn",
"serveExpiredTTLDesc": "Thời gian hiệu lực (giây) của các mục cache hết hạn; 0 = không bao giờ hết hạn",
"timeoutMs": "Thời gian chờ (ms)",
"skipFallback": "Bỏ qua Fallback",
"finalQuery": "Truy vấn cuối",
"hosts": "Hosts",
"hostsAdd": "Thêm Host",
"hostsEmpty": "Chưa có Host nào",
"hostsDomain": "Tên miền (vd. domain:example.com)",
"hostsValues": "IP hoặc tên miền — nhập và nhấn Enter",
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
"usePreset": "Dùng mẫu",
"dnsPresetTitle": "Mẫu DNS",
"dnsPresetFamily": "Gia đình",
feat(xray/dns): align DNS settings with Xray docs + UI polish - DNS server modal: rename expectIPs -> expectedIPs (per docs); add per-server tag, clientIP, serveStale, serveExpiredTTL, timeoutMs; flip skipFallback default to false; hydration still accepts legacy expectIPs for back-compat. - DNS tab: add hosts editor (domain -> IP/array), serveStale + serveExpiredTTL controls, "Use Preset" button bringing back the legacy preset gallery (Google / Cloudflare / AdGuard + Family variants — fixed AdGuard Family IPs that were wrong in legacy), and a "Delete All" button to wipe the server list at once. - i18n: add 15 new dns.* keys across all 13 locales. - Frontend-wide formatter pass on Vue components (whitespace and attribute layout only, no behavior changes). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-10 15:03:11 +00:00
"clearAll": "Xóa tất cả",
"clearAllTitle": "Xóa tất cả máy chủ DNS?",
"clearAllConfirm": "Thao tác này sẽ xóa toàn bộ máy chủ DNS khỏi danh sách. Không thể hoàn tác."
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
},
"fakedns": {
"add": "Thêm DNS giả",
"edit": "Chỉnh sửa DNS giả",
"ipPool": "Mạng con nhóm IP",
"poolSize": "Kích thước bể bơi"
}
}
},
"tgbot": {
"keyboardClosed": "❌ Bàn phím đã đóng!",
"noResult": "❗ Không có kết quả!",
"noQuery": "❌ Không tìm thấy truy vấn! Vui lòng sử dụng lại lệnh!",
"wentWrong": "❌ Đã xảy ra lỗi!",
"noIpRecord": "❗ Không có bản ghi IP!",
"noInbounds": "❗ Không tìm thấy inbound!",
"unlimited": "♾ Không giới hạn (Đặt lại)",
"add": "Thêm",
"month": "Tháng",
"months": "Tháng",
"day": "Ngày",
"days": "Ngày",
"hours": "Giờ",
"minutes": "Phút",
"unknown": "Không xác định",
"inbounds": "Inbound",
"clients": "Client",
"offline": "🔴 Ngoại tuyến",
"online": "🟢 Trực tuyến",
"commands": {
"unknown": "❗ Lệnh không rõ",
"pleaseChoose": "👇 Vui lòng chọn:\r\n",
"help": "🤖 Chào mừng bạn đến với bot này! Bot được thiết kế để cung cấp cho bạn dữ liệu cụ thể từ máy chủ và cho phép bạn thực hiện các thay đổi cần thiết.\r\n\r\n",
"start": "👋 Xin chào <i>{{ .Firstname }}</i>.\r\n",
"welcome": "🤖 Chào mừng đến với bot quản lý của <b>{{ .Hostname }}</b>.\r\n",
"status": "✅ Bot hoạt động bình thường!",
"usage": "❗ Vui lòng cung cấp văn bản để tìm kiếm!",
"getID": "🆔 ID của bạn: <code>{{ .ID }}</code>",
"helpAdminCommands": "Để khởi động lại Xray Core:\r\n<code>/restart</code>\r\n\r\nĐể tìm kiếm email của khách hàng:\r\n<code>/usage [Email]</code>\r\n\r\nĐể tìm kiếm các nhập (với số liệu thống kê của khách hàng):\r\n<code>/inbound [Ghi chú]</code>\r\n\r\nID Trò chuyện Telegram:\r\n<code>/id</code>",
"helpClientCommands": "Để tìm kiếm thống kê, sử dụng lệnh sau:\r\n<code>/usage [Email]</code>\r\n\r\nID Trò chuyện Telegram:\r\n<code>/id</code>",
"restartUsage": "\r\n\r\n<code>/restart</code>",
"restartSuccess": "✅ Hoạt động thành công!",
"restartFailed": "❗ Lỗi trong quá trình hoạt động.\r\n\r\n<code>Lỗi: {{ .Error }}</code>.",
"xrayNotRunning": "❗ Xray Core không chạy.",
"startDesc": "Hiển thị menu chính",
"helpDesc": "Trợ giúp bot",
"statusDesc": "Kiểm tra trạng thái bot",
"idDesc": "Hiển thị ID Telegram của bạn"
},
"messages": {
"cpuThreshold": "🔴 Sử dụng CPU {{ .Percent }}% vượt quá ngưỡng {{ .Threshold }}%",
"selectUserFailed": "❌ Lỗi khi chọn người dùng!",
"userSaved": "✅ Người dùng Telegram đã được lưu.",
"loginSuccess": "✅ Đăng nhập thành công vào bảng điều khiển.\r\n",
"loginFailed": "❗️ Đăng nhập vào bảng điều khiển thất bại.\r\n",
"2faFailed": "Lỗi 2FA",
"report": "🕰 Báo cáo định kỳ: {{ .RunTime }}\r\n",
"datetime": "⏰ Ngày-Giờ: {{ .DateTime }}\r\n",
"hostname": "💻 Tên máy chủ: {{ .Hostname }}\r\n",
"version": "🚀 Phiên bản X-UI: {{ .Version }}\r\n",
"xrayVersion": "📡 Phiên bản Xray: {{ .XrayVersion }}\r\n",
"ipv6": "🌐 IPv6: {{ .IPv6 }}\r\n",
"ipv4": "🌐 IPv4: {{ .IPv4 }}\r\n",
"ip": "🌐 IP: {{ .IP }}\r\n",
"ips": "🔢 Các IP:\r\n{{ .IPs }}\r\n",
"serverUpTime": "⏳ Thời gian hoạt động của máy chủ: {{ .UpTime }} {{ .Unit }}\r\n",
"serverLoad": "📈 Tải máy chủ: {{ .Load1 }}, {{ .Load2 }}, {{ .Load3 }}\r\n",
"serverMemory": "📋 Bộ nhớ máy chủ: {{ .Current }}/{{ .Total }}\r\n",
"tcpCount": "🔹 Số lượng kết nối TCP: {{ .Count }}\r\n",
"udpCount": "🔸 Số lượng kết nối UDP: {{ .Count }}\r\n",
"traffic": "🚦 Lưu lượng: {{ .Total }} (↑{{ .Upload }},↓{{ .Download }})\r\n",
"xrayStatus": "ℹ️ Trạng thái Xray: {{ .State }}\r\n",
"username": "👤 Tên người dùng: {{ .Username }}\r\n",
"reason": "❗️ Lý do: {{ .Reason }}\r\n",
"time": "⏰ Thời gian: {{ .Time }}\r\n",
"inbound": "📍 Inbound: {{ .Remark }}\r\n",
"port": "🔌 Cổng: {{ .Port }}\r\n",
"expire": "📅 Ngày hết hạn: {{ .Time }}\r\n",
"expireIn": "📅 Hết hạn sau: {{ .Time }}\r\n",
"active": "💡 Đang hoạt động: {{ .Enable }}\r\n",
"enabled": "🚨 Đã bật: {{ .Enable }}\r\n",
"online": "🌐 Trạng thái kết nối: {{ .Status }}\r\n",
"lastOnline": "🔙 Lần online gần nhất: {{ .Time }}\r\n",
"email": "📧 Email: {{ .Email }}\r\n",
"upload": "🔼 Tải lên: ↑{{ .Upload }}\r\n",
"download": "🔽 Tải xuống: ↓{{ .Download }}\r\n",
"total": "📊 Tổng cộng: ↑↓{{ .UpDown }} / {{ .Total }}\r\n",
"TGUser": "👤 Người dùng Telegram: {{ .TelegramID }}\r\n",
"exhaustedMsg": "🚨 Sự cạn kiệt {{ .Type }}:\r\n",
"exhaustedCount": "🚨 Số lần cạn kiệt {{ .Type }}:\r\n",
"onlinesCount": "🌐 Khách hàng trực tuyến: {{ .Count }}\r\n",
"disabled": "🛑 Vô hiệu hóa: {{ .Disabled }}\r\n",
"depleteSoon": "🔜 Sắp cạn kiệt: {{ .Deplete }}\r\n\r\n",
"backupTime": "🗄 Thời gian sao lưu: {{ .Time }}\r\n",
"refreshedOn": "\r\n📋🔄 Đã cập nhật lần cuối vào: {{ .Time }}\r\n\r\n",
"yes": "✅ Có",
"no": "❌ Không",
"received_id": "🔑📥 ID đã được cập nhật.",
"received_password": "🔑📥 Mật khẩu đã được cập nhật.",
"received_email": "📧📥 Email đã được cập nhật.",
"received_comment": "💬📥 Bình luận đã được cập nhật.",
"id_prompt": "🔑 ID mặc định: {{ .ClientId }}\n\nVui lòng nhập ID của bạn.",
"pass_prompt": "🔑 Mật khẩu mặc định: {{ .ClientPassword }}\n\nVui lòng nhập mật khẩu của bạn.",
"email_prompt": "📧 Email mặc định: {{ .ClientEmail }}\n\nVui lòng nhập email của bạn.",
"comment_prompt": "💬 Bình luận mặc định: {{ .ClientComment }}\n\nVui lòng nhập bình luận của bạn.",
"inbound_client_data_id": "🔄 Kết nối vào: {{ .InboundRemark }}\n\n🔑 ID: {{ .ClientId }}\n📧 Email: {{ .ClientEmail }}\n📊 Dung lượng: {{ .ClientTraffic }}\n📅 Ngày hết hạn: {{ .ClientExp }}\n🌐 Giới hạn IP: {{ .IpLimit }}\n💬 Ghi chú: {{ .ClientComment }}\n\nBây giờ bạn có thể thêm khách hàng vào inbound!",
"inbound_client_data_pass": "🔄 Kết nối vào: {{ .InboundRemark }}\n\n🔑 Mật khẩu: {{ .ClientPass }}\n📧 Email: {{ .ClientEmail }}\n📊 Dung lượng: {{ .ClientTraffic }}\n📅 Ngày hết hạn: {{ .ClientExp }}\n🌐 Giới hạn IP: {{ .IpLimit }}\n💬 Ghi chú: {{ .ClientComment }}\n\nBây giờ bạn có thể thêm khách hàng vào inbound!",
"cancel": "❌ Quá trình đã bị hủy! \n\nBạn có thể bắt đầu lại bất cứ lúc nào bằng cách nhập /start. 🔄",
"error_add_client": "⚠️ Lỗi:\n\n {{ .error }}",
"using_default_value": "Được rồi, tôi sẽ sử dụng giá trị mặc định. 😊",
"incorrect_input": "Dữ liệu bạn nhập không hợp lệ.\nCác chuỗi phải liền mạch và không có dấu cách.\nVí dụ đúng: aaaaaa\nVí dụ sai: aaa aaa 🚫",
"AreYouSure": "Bạn có chắc không? 🤔",
"SuccessResetTraffic": "📧 Email: {{ .ClientEmail }}\n🏁 Kết quả: ✅ Thành công",
"FailedResetTraffic": "📧 Email: {{ .ClientEmail }}\n🏁 Kết quả: ❌ Thất bại \n\n🛠️ Lỗi: [ {{ .ErrorMessage }} ]",
"FinishProcess": "🔚 Quá trình đặt lại lưu lượng đã hoàn tất cho tất cả khách hàng."
},
"buttons": {
"closeKeyboard": "❌ Đóng Bàn Phím",
"cancel": "❌ Hủy",
"cancelReset": "❌ Hủy Đặt Lại",
"cancelIpLimit": "❌ Hủy Giới Hạn IP",
"confirmResetTraffic": "✅ Xác Nhận Đặt Lại Lưu Lượng?",
"confirmClearIps": "✅ Xác Nhận Xóa Các IP?",
"confirmRemoveTGUser": "✅ Xác Nhận Xóa Người Dùng Telegram?",
"confirmToggle": "✅ Xác nhận Bật/Tắt người dùng?",
"dbBackup": "Tải bản sao lưu cơ sở dữ liệu",
"serverUsage": "Sử Dụng Máy Chủ",
"getInbounds": "Lấy cổng vào",
"depleteSoon": "Depleted Soon",
"clientUsage": "Lấy Sử Dụng",
"onlines": "Khách hàng trực tuyến",
"commands": "Lệnh",
"refresh": "🔄 Cập Nhật",
"clearIPs": "❌ Xóa IP",
"removeTGUser": "❌ Xóa Người Dùng Telegram",
"selectTGUser": "👤 Chọn Người Dùng Telegram",
"selectOneTGUser": "👤 Chọn một người dùng telegram:",
"resetTraffic": "📈 Đặt Lại Lưu Lượng",
"resetExpire": "📅 Thay đổi ngày hết hạn",
"ipLog": "🔢 Nhật ký địa chỉ IP",
"ipLimit": "🔢 Giới Hạn địa chỉ IP",
"setTGUser": "👤 Đặt Người Dùng Telegram",
"toggle": "🔘 Bật / Tắt",
"custom": "🔢 Tùy chỉnh",
"confirmNumber": "✅ Xác nhận: {{ .Num }}",
"confirmNumberAdd": "✅ Xác nhận thêm: {{ .Num }}",
"limitTraffic": "🚧 Giới hạn lưu lượng",
"getBanLogs": "Cấm nhật ký",
"allClients": "Tất cả Khách hàng",
"addClient": "Thêm Khách Hàng",
"submitDisable": "Gửi Dưới Dạng Vô Hiệu ☑️",
"submitEnable": "Gửi Dưới Dạng Kích Hoạt ✅",
"use_default": "🏷️ Sử Dụng Mặc Định",
"change_id": "⚙️🔑 ID",
"change_password": "⚙️🔑 Mật Khẩu",
"change_email": "⚙️📧 Email",
"change_comment": "⚙️💬 Bình Luận",
feat(tgbot): add Flow picker when creating a VLESS client The bot's add-client flow already serialised client_Flow into the VLESS JSON template but never exposed a way to set it from Telegram, so every client ended up with an empty flow regardless of the inbound's transport. Added an inline "Flow" row to the VLESS protocol keyboard with three choices — None, xtls-rprx-vision, and xtls-rprx-vision-udp443 — and a matching i18n key in all 13 locale files. The row is only shown when the inbound can actually use Vision flow (mirrors the frontend's canEnableTlsFlow check: VLESS over TCP with TLS or Reality); on other transports it's hidden and any stale client_Flow value is reset, so the generated JSON stays consistent with the inbound's stream settings.
2026-05-15 11:12:54 +00:00
"change_flow": "⚙️🚦 Flow",
Vue3 migration (#4198) * docs(migration): Phase 1 inventory — Vue 2 / AD-Vue 1 surface area Captures the breakage surface for the Vue 3 + Ant Design Vue 4 + Vite migration: 17,650 lines across 69 templates, 3,145 a-* component instances across 63 files, with per-pattern counts and file lists. Key findings: - No Vue filters anywhere — dodges a major Vue 3 breaking change - 358 v-model uses; AD-Vue 4 absorbs most, custom components don't - 233 <template slot="X"> usages must become <template #X> - 49 scopedSlots: { ... } column defs need new slots: { ... } shape - a-icon is removed in AD-Vue 4 — every icon must be imported Establishes the 8-phase order; Phase 2 (Vite toolchain) is next. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): Phase 2 — scaffold Vite + Vue 3 + AD-Vue 4 Adds a frontend/ directory that lives alongside the legacy web/html/ Vue 2 templates during the migration. Vite builds into ../web/dist/ so the Go binary will be able to embed the result via embed.FS once Phase 4 starts moving real pages over. - package.json pins Vue 3.5, Ant Design Vue 4.2, Vite 6, vue-i18n 10 - vite.config.js: dev server on :5173 with API proxy to the Go panel on :2053; build output to ../web/dist/ - src/App.vue is currently a smoke-test placeholder — delete once the first real page (login) lands in Phase 4 - node_modules and dist are already ignored at repo root To verify locally: cd frontend && npm install && npm run dev Pages will be migrated one at a time on the vue3-migration branch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): Phase 3 — port utils, models, axios, websocket as ES modules Ports the framework-agnostic JS from web/assets/js/ into frontend/src/ so Vue 3 pages can import what they need without relying on script-tag globals. - web/assets/js/util/index.js (927 lines, 21 classes) → frontend/src/utils/legacy.js + a barrel at utils/index.js. All classes are now named exports. - Vue.prototype.$message in HttpUtil → direct import of `message` from ant-design-vue (Vue 3 has no Vue.prototype). - RandomUtil.randomShadowsocksPassword previously defaulted to SSMethods.BLAKE3_AES_256_GCM from inbound.js, creating a circular import. Replaced with the literal string default. - MediaQueryMixin (Vue 2 mixin) removed. Replaced by composables/useMediaQuery.js — Vue 3 composable returning reactive `isMobile`. - axios-init.js wrapped as setupAxios(); Qs global → npm `qs`. - websocket.js exported as WebSocketClient class; the implicit window.wsClient global is gone — pages instantiate it themselves. - model/{inbound,outbound,dbinbound,setting,reality_targets}.js copied with `export` added on every top-level declaration. Imports between models and utils are wired up explicitly. - subscription.js deferred to Phase 5 (it's a Vue 2 mount, not a util). - App.vue smoke test exercises SizeFormatter / RandomUtil / Wireguard / useMediaQuery so the user can verify Phase 3 with `npm run dev`. Run `cd frontend && npm install && npm run dev` — qs was added so a fresh install is required. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 4 — port login.html to Vue 3 + AD-Vue 4 + Vite 8 First real page in the new toolchain. Multi-page Vite: each migrated page is its own entry. login.html now lives at frontend/login.html with a thin entrypoint at frontend/src/login.js mounting LoginPage.vue. Vite 6 → Vite 8.0.11 (per user request). Requires Node 20.19+ or 22.12+. @vitejs/plugin-vue bumped to ^6.0.6 (peers vite ^8). Ant Design Vue stays on 4.2.6 — there is no AD-Vue 6. Vue 2 → Vue 3 / AD-Vue 1 → AD-Vue 4 syntax changes hit on this page: - new Vue({ el, delimiters, data, methods }) → createApp + <script setup> - mounted() → onMounted() - <template slot="X"> → <template #X> - <a-icon slot="prefix" type="user"> → <template #prefix><UserOutlined /> </template> with explicit @ant-design/icons-vue imports - v-model.trim → v-model:value (AD-Vue 4 uses named v-model on inputs) Three legacy features deferred so Phase 4 stays small: - i18n (Phase 7 wires up vue-i18n) - theme switcher (custom component pending Phase 5) - headline word-cycle animation (purely aesthetic) Run `cd frontend && npm install && npm run dev`, open http://localhost:5173/login.html. With Go panel running on :2053 the form submits real credentials via the configured proxy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5a — theme system + Vite 8 + vue-i18n 11 Bumps Vite to 8.0.11 (npm install picked up 6.4.2 from the stale lockfile; clean install resolves the new constraint). Bumps vue-i18n to 11.1.4 since v10 was just EOL'd. Migrates aThemeSwitch.html — the two-flavor theme picker + global themeSwitcher object — into: - composables/useTheme.js: single reactive `theme` state with toggleTheme / toggleUltra. Boot side-effect applies the stored theme to <body>/<html> before Vue renders; watchEffect persists changes back to localStorage. - components/ThemeSwitch.vue: full menu version for the main panel. - components/ThemeSwitchLogin.vue: login-popover version. AD-Vue 1 → 4 changes hit on this component: - <a-icon type="bulb" :theme="filled|outlined"> dropped — replaced by explicit BulbFilled / BulbOutlined imports from @ant-design/icons-vue, swapped via <component :is="BulbIcon"> - Vue.component('a-theme-switch', { ... }) global registration → SFC + per-page import - this.$message.config(...) (Vue 2 instance method) → message.config(...) imported from ant-design-vue, called once in login.js at boot Login page now surfaces a settings button → popover → theme picker. Known gap: web/assets/css/custom.min.css isn't yet imported into the new bundle, so toggling dark mode currently only re-themes AD-Vue's own components, not the panel chrome. The body class is still toggled so behavior is correct; visual fidelity returns when custom.css is ported or directly imported. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5b — port four shared components to Vue 3 CustomStatistic.vue and SettingListItem.vue are mechanical Vue.component → SFC ports. AppSidebar.vue: AD-Vue 4 dropped <a-icon :type="dynamic">, so the five sidebar icons (dashboard/user/setting/tool/logout) live in a name→component map and render via <component :is>. The legacy <a-drawer slot="handle"> hack is replaced with a sibling fixed- position toggle button. Tab paths take basePath/requestUri as props instead of pulling them from Go template scope. TableSortable.vue: the biggest Vue 3 rewrite of this phase. - $listeners is gone — replaced by inheritAttrs: false + explicit attrs forwarding - scopedSlots: this.$scopedSlots collapsed into Vue 3's unified slots object — just iterate Object.keys(this.slots) and forward - Vue 2 h(tag, { props, on, scopedSlots }, children) → Vue 3 h(tag, { ...props, ...on }, slotsObject) - 'a-table' string → resolveComponent('a-table') so app.use(Antd) registration is honored - inject: ['sortable'] (Options API) → inject('sortable', null) (Composition API) inside the trigger child - beforeDestroy → beforeUnmount - customRow's return shape flattened (no nested props/on/class) Two intentional skips, documented in the migration doc: - aClientTable.html — slot fragments, not a component. Migrates inline with inbounds.html (new Phase 5f). - aPersianDatepicker.html — wraps a Persian-only third-party lib; defer until settings.html lands. Build verified with vite 8.0.11. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): anchor Vite dev proxy so /login.html isn't forwarded The /login proxy entry was matching any path starting with /login — including /login.html, which Vite is supposed to serve itself. Without the Go backend running, this caused ECONNREFUSED noise on every page load. Switched to regex patterns anchored with ^...$ so only the bare backend paths (/login, /logout, /getTwoFactorEnable) and explicit sub-routes (/panel/*, /server/*) get proxied. Static .html files Vite serves directly are no longer matched. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): real dark mode + silence dev proxy ECONNREFUSED noise Two issues from running login.html against no Go backend: 1. Dark mode toggled the body class but didn't actually re-theme any AD-Vue components. The legacy panel relied on custom.min.css which we haven't ported. AD-Vue 4 ships its own dark algorithm — wrap LoginPage in <a-config-provider :theme="{ algorithm }"> driven by our useTheme state, and AD-Vue restyles every component for free. Page chrome (background, card, title) gets explicit .is-dark CSS since the algorithm only covers AD-Vue components. 2. Vite logged every failed proxy attempt loudly. When the Go panel isn't running locally that's pure noise. Added a configure() callback that swallows ECONNREFUSED specifically; real errors (timeouts, 5xx, anything else) still surface. Both fixes are dev-experience only — production build is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): use legacy panel palette for login page dark mode Earlier dark mode used invented colors (#141a26 page bg, #1f2937 card) that didn't match the rest of the panel. Replaced with the actual values from web/assets/css/custom.min.css: light dark ultra-dark bg #c7ebe2 bg #222d42 bg #0f2d32 card #fff card #151f31 card #0c0e12 title #008771 title #fff/.92 title #fff/.92 Drove everything off CSS custom properties on .login-app so the .is-dark / .is-ultra class swap is a few var overrides instead of duplicating selectors. Also restored the legacy card metrics (2rem radius, 4rem 3rem padding, 2rem title) so the new page matches the old panel's geometry, not just its colors. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave layout + recolor for dark mode The wave SVG had inline fill="#c7ebe2" (mint) on the bottom wave, so in dark/ultra-dark mode it rendered as a pale-white blob against the dark page. Stripped the inline fills, drove them off CSS variables that swap with .is-dark / .is-ultra: light: green tints + #c7ebe2 (mint) on the bottom wave dark: #222d42 across all four waves ultra-dark: #0f2d32 The wave was also positioned wrong — anchored to the top 200px of the viewport with absolute positioning. Restored the legacy layout: - .waves-header is fixed to the top of the viewport with z-index -1 so the form floats over it - .waves-inner-header pushes the wave SVG down to ~50vh with a 50vh-tall solid block of the page color - .waves SVG itself is 15vh tall, sitting at the bottom of that block Net effect: top half is solid-colored, then a wavy edge transitions into the rest of the page, with the form centered on top — matching the legacy panel exactly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): bring wave-header to front so the wave actually shows Two layering bugs were hiding the wave entirely: 1. .ant-layout-content had background: var(--bg-page) which painted an opaque rectangle covering the full content area — including the fixed wave-header behind it. Made the layout/content transparent and moved the bg paint up to .login-app (the outer ant-layout). 2. .waves-header had z-index: -1 which on its own was fine, but with .ant-layout-content opaque on top it was doubly buried. Promoted the wave-header to z-index: 0 and gave the form .login-row z-index: 1, so the form sits above the wave and the wave sits above the page-bg. Also set --bg-page to the legacy mint (#c7ebe2) for light mode so the bottom half of the page below the wave matches the legacy panel (was white). Dark mode stays at the surface-100/login-wave palette. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): match legacy wave animation timings + dark page bg Two reasons the bottom wave looked static in dark/ultra-dark: 1. Animation durations were 7s/10s/13s/20s. Legacy uses 4s/7s/10s/13s. The 20s on the bottom wave was so slow that against the low dark- mode contrast it read as motionless. Restored the legacy timings. 2. --bg-page in dark mode was #151f31 (card color / surface-100), but the legacy .under uses surface-200 (#222d42) — that's the color of the bottom half of the page, the same as the wave fill, so the wave appears to flow into the page rather than meeting a hard edge. Now it does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): restore Hello/Welcome headline cycle on login Earlier I deferred the legacy headline word-cycling animation as "purely aesthetic". Restored it: the title now alternates between 'Hello' and 'Welcome' every 2 seconds, matching the legacy panel. The legacy implementation toggled .is-visible / .is-hidden classes on two <b> elements via setTimeout chains and DOM querying. Replaced with a reactive ref + Vue 3 <Transition mode="out-in"> so the fade between words is declarative — no manual DOM manipulation, and the interval is properly cleaned up in onBeforeUnmount. The earlier "Welcome to 3x-ui" string was wrong on two counts: it should be just "Welcome", and it should be one of two cycling words with "Hello" preceding it. Ultra-dark palette already matched legacy after the prior wave timing fix; no additional changes needed there beyond the animation speeds that now also apply to ultra-dark via the shared CSS rules. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): correct dark login bg + give ultra-dark wave real contrast Two related fixes: 1. Default-dark wave-header bg was wrong. I had #0a2227, but that's the *ultra-dark* override; default dark uses --dark-color-background = #0a1222. Now the dark-mode top half is the legacy purple-blue instead of teal. 2. Ultra-dark wave fill is intentionally near-identical to its bg in the legacy palette (#0f2d32 vs #0a2227, ~5/11/11 RGB delta), which makes the wave look static even though the animation is running. Bumped --wave-fill / --wave-fill-bottom to #1f4d52 in ultra-dark only — far enough above the bg that the motion reads, while staying within the same teal hue family. Also corrected ultra-dark --bg-page back to #0f2d32 (was briefly #0c0e12, which is the card color, not the page color). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): drop ultra-dark bottom-wave seam line Last fix made the wave fill #1f4d52 in ultra-dark for both top-three waves and the bottom wave, which gave visible motion but exposed a hard horizontal line where the bottom wave's flat lower edge met the page bg (#0f2d32). The user noticed it as "the wave at the bottom not moving its like a line" — they were seeing the SVG's clipped bottom edge, not the wave itself. Solution: only the top three waves get the brighter fill (those carry the visible motion). The bottom wave reverts to #0f2d32 = --bg-page, so its flat bottom edge merges seamlessly into the page below. Net effect: motion is still visible (from waves 2 and 3), and there's no seam line at the bottom of the SVG. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-i — index.html dashboard shell Replaces the smoke-test App.vue with a real IndexPage shell so the /index.html route now boots the actual dashboard layout in Vue 3: - a-config-provider drives AD-Vue 4's dark algorithm from useTheme (same pattern as LoginPage) - AppSidebar (Phase 5b component) is wired in with basePath + requestUri props - a-spin loading state with placeholder card while we build out the rest of the page - Page palette mirrors the legacy: light #f0f2f5, dark #0a1222 (--dark-color-background), ultra-dark #21242a The 1,805-line legacy index.html is too big for one commit. Split into five sub-phases on the todo list: ii) status cards + /server/status polling, iii) xray status card, iv) logs/backup/panel-update modals, v) custom-geo section. frontend/src/App.vue and frontend/src/main.js (smoke-test scaffold) are removed — both purposes now served by IndexPage and index.js. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-ii — live status cards on the dashboard Adds the CPU / memory / swap / disk dashboard cards to IndexPage, backed by a useStatus() composable that polls /panel/api/server/status every 2 s and a Status / CurTotal model ported from the legacy inline classes in index.html. - models/status.js — Status & CurTotal classes (CurTotal exposes reactive .percent and .color computed-style getters; Status maps the API payload + xray state to color/message strings) - composables/useStatus.js — 2s polling with shallowRef so each fetch swaps the whole Status object atomically. WebSocket integration intentionally deferred — the legacy panel falls back to this same 2s polling when its websocket drops, so we ship the proven path first and add WS on top in a later sub-phase. - pages/index/StatusCard.vue — four a-progress dashboard widgets in a 2x2 grid (mobile collapses to a 1x4). CPU widget exposes a history button; the modal it opens is part of 5c-iv. - IndexPage now consumes both, plus useMediaQuery so the layout responds to viewport changes. AD-Vue 4 changes: <a-icon type="area-chart"|"history"> dropped in favor of explicit AreaChartOutlined / HistoryOutlined imports. <a-tooltip slot="title"> → <template #title>. i18n strings still hardcoded English (Phase 7 wires up vue-i18n). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iii — xray status card + stop/restart controls XrayStatusCard.vue renders the right-hand card on the dashboard: - Title with mobile-only version tag (matches the legacy collapse) - Animated badge for the running/stop/error states. The pulsing dot comes from xray-pulse keyframes (renamed from runningAnimation in legacy custom.min.css). Color rings on the badge use the legacy's per-state border-color overrides on .ant-badge-status-processing. - Error state replaces the badge with a popover that surfaces the multi-line errorMsg + a logs shortcut. - Action row at the bottom: optional logs (when ipLimitEnable), stop, restart, and version switch. IndexPage now wires: - POST /panel/api/server/stopXrayService and /restartXrayService, followed by a refresh() so the status card reflects the new state without waiting for the next poll tick - POST /panel/setting/defaultSettings to read ipLimitEnable - Stub handlers for the panel-logs / xray-logs / version-switch / cpu-history modals — those land in 5c-iv AD-Vue 4 changes hit on this card: - <a-icon type="bars|poweroff|reload|tool"> → explicit BarsOutlined / PoweroffOutlined / ReloadOutlined / ToolOutlined - <span slot="title|content"> → <template #title|#content> - The .xray-*-animation classes ship as global <style> (not scoped) so they pierce AD-Vue's internal .ant-badge-status-* DOM. i18n still hardcoded English; Phase 7 wires vue-i18n. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (a) — panel update / logs / backup modals Adds three of the six dashboard modals plus a Quick Actions card that surfaces them. The remaining three (xray logs, version picker, CPU history sparkline) ship in 5c-iv-b. - PanelUpdateModal.vue — current vs latest version, "update now" button. Confirm dialog → POST /panel/api/server/updatePanel, then poll /server/status for up to 90s until the new panel answers, then reload. - LogModal.vue — panel logs viewer. Filters: rows (10-500), level (debug/info/notice/warning/error), syslog toggle. Auto-fetches on open and on every filter change. Color-coded timestamps and levels via inline span styles. Download button writes the raw log to x-ui.log via FileManager.downloadTextFile. - BackupModal.vue — db export (window.location to /getDb) and import (FormData upload to /importDB, then panel restart + reload). - Quick Actions card surfaces Logs / Backup / Update buttons and shows an orange update badge (extra slot) when an update is available. Modal-busy pattern: long-running operations (update, import) emit a `busy` event with a tip; IndexPage flips its a-spin overlay so the user sees a loading message while the panel is restarting. AD-Vue 4 changes: - v-model on <a-modal> renamed to v-model:open - v-model on <a-input>/<a-select>/<a-checkbox> uses the named v-model:value / v-model:checked pattern - <a-icon type="..."> dropped — explicit Ant icon imports (BarsOutlined, CloudServerOutlined, CloudDownloadOutlined, DownloadOutlined, UploadOutlined, SyncOutlined) - Modal.confirm() replaces this.$confirm() since setup() has no `this` Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-iv (b) — cpu-history / xray-logs / xray-version modals Wires up the three remaining dashboard buttons that were stubbed in 5c-iv (a): the CPU history button on StatusCard, the xray-logs button in XrayStatusCard's error popover and ipLimitEnable action, and the "Switch xray" button in XrayStatusCard's action footer. - Sparkline.vue: shared SVG line chart (composition-API port of the inline Vue 2 component). Per-instance gradient id avoids defs collisions between sparklines on the same page. - CpuHistoryModal.vue: bucket dropdown (2m/30m/1h/2h/3h/5h) drives GET /panel/api/server/cpuHistory/{bucket}; renders via Sparkline. - XrayLogModal.vue: rows + filter + direct/blocked/proxy checkboxes; POST /panel/api/server/xraylogs/{rows} returns access-log entries rendered as a colored HTML table; download button serializes to text. - VersionModal.vue: collapse with Xray panel (radio list of versions from getXrayVersion, install via installXray/{version}) and Geofiles panel (per-file reload + Update all). CustomGeo collapse panel is Phase 5c-v. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5c-v — custom-geo section in VersionModal Adds the third collapse panel ("Custom geo") that lets users register external geosite/geoip files referenced by routing rules via ext:<filename>:tag. Backend endpoints are unchanged. - CustomGeoSection.vue: bordered table over /panel/api/custom-geo/list with per-row edit, download (refetch), and delete actions, plus an Add button and Update-all. Lazy-loads the list when the parent collapse opens this panel — closed panels don't fetch. - CustomGeoFormModal.vue: shared add/edit form with the same alias regex (^[a-z0-9_-]+$) and URL validation as legacy. Type and alias are immutable when editing — backend rejects changes anyway. - ext:<filename>:tag value is click-to-copy via ClipboardManager. - Relative time is computed inline (no moment dep); tooltip shows the absolute timestamp. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-i — settings page shell + dirty tracking Adds the settings entry as a new Vite multi-page input. Lays down the shared page chrome (sidebar, save bar, restart, security alert) and the AllSetting fetch/dirty-poll lifecycle so 5d-ii through 5d-vi can drop in tab partials without re-implementing it. - settings.html + src/settings.js: third Vite entry; mounts SettingsPage. - SettingsPage.vue: page chrome with the legacy two-button save/restart bar, conf-alerts banner, and 5 a-tabs (4 always-visible + the formats tab gated on subJsonEnable || subClashEnable). Each tab body is an a-empty placeholder until 5d-ii…vi fill them in. - useAllSetting.js composable: POST /panel/setting/all on mount, mirrors the legacy 1s busy-loop dirty check via setInterval, and exposes fetchAll/saveAll. saveDisabled flips off as soon as the user diverges from the server snapshot. - restartPanel rebuilds the URL (host/port/scheme/base path) from the saved settings so users land on the new endpoint after a port or cert change. - models/setting.js: adopts the @/utils alias and a leading file-level doc — semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-ii — settings General tab Ports the panel/general partial (the largest single tab) — six collapse panels: General, Notifications, Certificates, External traffic webhook, Date and time, LDAP. - GeneralTab.vue receives the reactive AllSetting via props and binds fields directly with v-model:value; SettingsPage stays the sole fetch/save owner. - remarkModel/remarkSeparator surfaced as computed v-models that read+write the underlying single-string field (legacy stores them packed as <separator><orderedKeys>, e.g. "-ieo"). - LDAP inbound-tags select binds to a CSV ↔ array computed; inbound options come from /panel/api/inbounds/list on mount. - Language select stays cookie-based via LanguageManager and reloads on change — same UX as legacy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iii — settings Security tab + 2FA modal Ports the panel/security partial: change-credentials form and 2FA toggle. The 2FA modal is a new shared component since enabling 2FA, disabling 2FA, and changing credentials all funnel through it with slightly different copy. - TwoFactorModal.vue: 'set' flow renders a QR code + manual key + a 6-digit verifier; 'confirm' flow renders just the verifier. The parent passes a confirm(success) callback that fires only when the entered code matches the live TOTP value (otpauth lib). - SecurityTab.vue: holds the local user form (oldUsername/oldPassword/ new*), POSTs /panel/setting/updateUser, and on success force-redirects to logout. When 2FA is on, the credentials change goes through the confirm-modal first. - toggleTwoFactor leaves the switch read-only (the v-bound :checked matches AllSetting) and only flips after the modal succeeds, so cancelling out leaves state unchanged. - Adds otpauth ^9.5.1 dep (qrious was already present). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-iv — settings Telegram tab Ports the panel/telegram partial: bot enable/token/chatId/lang in the General panel, schedule/backup/login/CPU-threshold in Notifications, and proxy/API-server overrides in the third panel. All bindings live on the shared AllSetting reactive — no fetch/save logic in this tab. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-v — settings Subscription general tab Ports the subscription/general partial — four collapse panels covering the master enable switches, presentation/template fields, certs, and update interval. - Sub path goes through a strip-on-input + normalize-on-blur computed: legacy stripped `:` and `*` and ensured the value starts and ends with a single `/` — same here. - Both `subEnableRouting` and the announce/profile/title/support URLs are bound directly on AllSetting. - The "Subscription URI override" placeholder mirrors the legacy pattern for the manual full-URL form. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5d-vi — settings Subscription formats tab Ports the subscription/json partial — paths/URIs for the JSON and Clash formats plus the four packed-JSON sub-fields: fragment, noises, mux, and direct routing rules. - subJsonFragment / subJsonMux / subJsonNoises / subJsonRules are each a JSON string on the wire; the tab exposes their fields as computed v-models that read+write the underlying JSON. Toggling a top-level switch off resets the field to "" (matches legacy semantics). - Direct routing rules surface the IP and domain entries of the seed rule array as multi-select tag inputs; setting/removing tags edits the rules array in place rather than rebuilding it from scratch, so manually-added rules are preserved. - Tab is gated on subJsonEnable || subClashEnable in the parent (only rendered when the user actually opted into one of those formats). This closes Phase 5d — full settings page parity with the legacy panel across all five tabs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): route /panel/<route> to migrated pages in dev The sidebar links to production-style URLs like /panel/settings, but in dev that gets proxied to the legacy Go template — which fails because we haven't loaded the legacy asset chain. Add a proxy bypass so /panel and /panel/settings are served from index.html / settings.html on the Vite dev server itself. Unmigrated routes (inbounds, xray) still proxy to Go. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(csrf): expose token endpoint for SPA pages and fetch it from axios The legacy panel pages got their CSRF token from a <meta name="csrf-token"> tag rendered by Go. SPA pages built by Vite don't have that, so every unsafe (POST/PUT/DELETE) request from them was hitting CSRFMiddleware with no token and getting 403 — visible as the settings page being stuck on "Loading…" because POST /panel/setting/all failed. - web/controller/xui.go: GET /panel/csrf-token returns the session token. Lives under the xui group so checkLogin still gates it; the CSRFMiddleware on the same group is a no-op for GET. - frontend/src/api/axios-init.js: cache the token at module scope and lazy-fetch it when a non-safe request needs one. Seed from the meta tag first when present (legacy compat). On a 403 response, drop the cache and retry once — handles the case where a server restart rotated the token after the SPA loaded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): keep sidebar links absolute when basePath is empty The dashboard sidebar built tab keys as basePath + 'panel/...'. In dev the window-injected basePath is '' so the resulting key was a relative path like 'panel/settings'. When the browser resolved that against the current /panel/settings URL it produced /panel/panel/settings — visible as broken navigation between Dashboard and Settings. Force a leading slash so the keys are always absolute regardless of whether the host injected a basePath. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-i — inbounds page shell + list fetch Adds the inbounds entry as a fourth Vite multi-page input and wires /panel/inbounds through the dev proxy bypass. Lays down the page chrome (sidebar, summary statistics card, refresh button) and the fetch lifecycle composable so 5f-ii onward can drop in the table columns and the modals without re-implementing it. - inbounds.html + src/inbounds.js: fourth Vite entry; mounts InboundsPage. - InboundsPage.vue: sidebar + summary card (totals over up/down, all-time, inbound count, client tags) + a basic table with enable/ remark/port/protocol/traffic/expiry columns. Row actions, popovers, search/filter, auto-refresh, and the WebSocket delta path are all deferred to subsequent 5f subphases. - useInbounds.js composable: GET /panel/api/inbounds/list + POST /panel/api/inbounds/onlines + POST /panel/api/inbounds/lastOnline + POST /panel/setting/defaultSettings, then computes the per-inbound clientCount roll-ups (active/deactive/depleted/expiring/ online/comments) the table popovers consume. - models/dbinbound.js + models/inbound.js: switched the legacy-utils import to the @/utils alias for consistency with the rest of the app. Semantics unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-ii — inbound list table + search/filter + auto-refresh Fleshes out the inbound list with the full column set, search & filter toolbar, row enable toggle wired to /panel/api/inbounds/setEnable/:id, and a per-row action dropdown that emits events the parent will route to modals as those land in 5f-iii through 5f-vii. - InboundList.vue (new): toolbar (Add inbound + General actions dropdown + Refresh + auto-refresh popover), search-or-filter switch with the legacy radio buttons (Active/Disabled/Depleted/Depleting/ Online), and a a-table with desktop and mobile column variants. Cells use AD-Vue 4's #bodyCell slot — protocol/clients/traffic/ allTime/expiry/info cells render the same popovers and tags as legacy. Row enable switch is optimistic with rollback on POST failure. - visibleInbounds computed mirrors the legacy search and filter projection: deep search through dbInbound + clients, or filter reduces inbound.settings.clients to the selected bucket so the table only shows matching client rows. - Auto-refresh interval is read/written to localStorage with the same keys (`isRefreshEnabled`, `refreshInterval`) as the legacy panel. WebSocket delta updates are still deferred. - Action menu emits event payloads {key, dbInbound}; the parent currently shows a "coming in later 5f subphase" toast for each. Modals (edit/qr/clone/delete/reset/info/clients) land in 5f-iii through 5f-vii. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): wrap popover-table rows in <tbody> Vue's template compiler warned that <tr> can't be a direct child of <table> per the HTML spec; the browser silently inserts a <tbody> wrapper but Vue's SSR/hydration path doesn't, which can cause hydration mismatches. Add explicit <tbody> in both popover tables (traffic + mobile-info). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii — inbound add/edit modal + delete/clone/reset Wires up the inbound CRUD flows. The protocol-specific and transport- specific forms are still ahead in 5f-iii-b — for now the modal exposes those as JSON textareas so users can both edit existing inbounds without losing settings and create new ones from default templates. - InboundFormModal.vue: tabbed modal with a full Basics tab (enable, remark, protocol, listen, port, total GB, traffic reset, expiry date) and three JSON-edit tabs (Settings, Stream, Sniffing). Add mode stamps a fresh template per protocol via Inbound.Settings.getSettings(protocol); changing the protocol in add mode restamps the JSON. Edit mode pretty-prints the existing JSON so the user sees the same fields they save back. - POST /panel/api/inbounds/add or /panel/api/inbounds/update/:id on submit; on success the parent refreshes the list and the modal closes. Malformed JSON in any of the three textareas surfaces a message.error and aborts the save without losing user input. - InboundsPage.vue: wires the row action menu to real handlers — edit (opens the modal in edit mode), delete, reset-traffic, clone, reset-clients, del-depleted-clients all go through Modal.confirm and refresh on success. General actions menu wires reset-inbounds / reset-clients / del-depleted-clients the same way. Remaining actions (qrcode/info/import/export/copyClients) still toast as "coming soon" — those land in 5f-iv and 5f-v. - Adds dayjs ^1.11.20 dep for the a-date-picker v-model interop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iv — client add/edit + bulk-add modals Wires per-inbound client management. Both flows go through the same addClient/updateClient endpoints as legacy; the modals just funnel the form state into the right shape (`{id, settings: '{"clients": [...]}'}`). - ClientFormModal.vue: protocol-aware single-client editor — email/ password/id/auth/security/flow/subId/tgId/comment/ipLimit/totalGB/ expiry/renewal fields are shown/hidden per protocol like legacy. Edit mode displays the per-client traffic stats with a reset button; IP-limit log is read on click and clearable. Random helpers (sync icon next to each label) regenerate UUID/email/ password/sub-id values. - ClientBulkModal.vue: 1–500 clients in one POST, with the legacy five email-generation modes (Random / +Prefix / +Num / +Postfix / Pure-Prefix-Num-Postfix). Builds clients via the protocol-aware factory and concatenates their toString() output into a single settings.clients JSON array. - InboundsPage.vue: opens both modals from the row action menu (`addClient` / `addBulkClient`). They both refresh the inbound list on success. - Outstanding row actions still toast as "coming soon": qrcode, showInfo, copyClients, clipboard. Those land in 5f-v / 5f-vi. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-v — inbound info + QR-code modals Wires the row "info" and "qrcode" actions and ports the legacy inbound_info_modal end-to-end. The info modal handles every protocol the legacy panel did: • multi-user (VMess/VLess/Trojan/SS-multi/Hysteria) — per-client table + share links + per-link QR; • SS single-user — share link + QR; • WireGuard — full peer table with downloadable peer-N.conf and a wg:// share link per peer; • Mixed/HTTP/Tunnel — connection-detail tables. - QrPanel.vue: shared link card (header tag, copy button, optional download button, optional QR canvas, monospace footer with the raw value). Per-instance QRious instances are repainted on value/size change. - InboundInfoModal.vue: full info modal. Subscription URL block keys off subSettings.subURI/subJsonURI; IP-log lazy-loads on open and surfaces refresh + clear; tg-id, last-online, depleted/enabled tags all match legacy. - QrCodeModal.vue: lighter modal used for the row "qrcode" action on SS-single and WireGuard inbounds (just the QRs, no info table). - InboundsPage.vue: wires both flows. checkFallback() reproduces the legacy logic — when an inbound listens on a unix-socket fallback (`@<name>`), the link generator is pointed at the root inbound that owns the listen address so QRs/links carry the public host:port + the right TLS state. Multi-client navigation (focusing a specific client's links) is deferred to 5f-vi where the per-inbound expand- row table will pass the email through. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vi — per-inbound client expand-row table Each multi-user inbound row in the list now expands to show its client roster, mirroring the legacy aClientTable component. - ClientRowTable.vue: inner a-table with full desktop column set (action icons / enable / online / client-with-status-dot / traffic with progress bar / all-time / expiry with reset cycle) and a collapsed mobile variant (single dropdown menu + popover info). Self-contained: stats are looked up via a per-inbound email->stats Map; per-client confirms (reset/delete) live on the row. - The component emits typed events (edit/qrcode/info/reset-traffic/ delete/toggle-enable) — InboundsPage routes them back to the existing client and info modals (with `findClientIndex` so the modal opens focused on the right client). - InboundList.vue: hooks ClientRowTable into the a-table's expandedRowRender slot; row-class-name `hide-expand-icon` and a scoped CSS rule hide the chevron for non-multi-user inbounds (HTTP/Mixed/Tunnel/WireGuard/SS-single) so they keep looking flat. - toggle-enable-client routes through updateClient with the same `{id, settings: '{"clients": [...]}'}` shape as the other modals, so backend parsing stays single-pathed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-iii-b — replace inbound modal JSON textareas with structured forms Rewrites InboundFormModal to look like the legacy panel: structured forms for the common case, with a compact "Advanced (JSON)" fallback for the rare bits we don't yet have UI for. Tabs: • Basics — enable/remark/protocol/listen/port/total/trafficReset/expiry • Protocol — protocol-aware: VMess/VLess/Trojan/SS-multi/Hysteria in add mode embed an inline first-client form (email + ID/password/auth, security, flow, subId, comment, total GB, expiry); edit mode shows a clients-count summary table; VLess: decryption/encryption inputs; SS: method dropdown that re-randomizes password and propagates method change to the multi-user array (matches legacy SSMethodChange); HTTP/Mixed: accounts table with add/remove rows + Mixed auth/udp/ip toggles; Tunnel: address/port/network/followRedirect; WireGuard: secretKey/pubKey (regen via Wireguard.generateKeypair) + per-peer fields with PSK regen + allowedIPs add/remove + keepAlive. • Stream — only when canEnableStream(); transport selector with structured forms for TCP (proxy-protocol, http camouflage), WS (host/path/heartbeat/headers), gRPC (serviceName, multiMode), HTTPUpgrade (host/path). KCP/XHTTP fall back to the Advanced tab with an alert banner. Security selector with TLS (sni/alpn/ fingerprint) and Reality (target/serverNames/keypair-gen via /panel/api/server/getNewX25519Cert / shortIds / fingerprint). • Sniffing — enabled/destOverride/metadataOnly/routeOnly/ ipsExcluded/domainsExcluded as structured fields. • Advanced (JSON) — raw streamSettings + sniffing JSON for users reaching KCP/XHTTP/sockopt/finalmask/full TLS cert arrays. The stream JSON is auto-synced from the live model whenever the structured fields change. State source of truth is a deeply-reactive Inbound + DBInbound pair cloned on open; submit serializes via inbound.settings.toString() + inbound.stream.toString() so the wire shape matches the legacy panel byte-for-byte. streamNetworkChange semantics (clear flow when TLS/Reality unavailable, reset finalmask.udp when not KCP) are preserved. Vision Seed for VLess + finer-grained TCP HTTP camouflage + the full TLS cert/ECH editor will land in 5f-iii-c. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 5f-vii — shared text/prompt modals + remaining export/import wiring Wires up the last batch of inbound row + general actions that were toasting "coming soon": export-inbound-links, export-subs (per-inbound and global), export-all-links, import-inbound, and the clipboard JSON peek. Two small shared components back them — both can be reused by the xray page later. - TextModal.vue (shared): read-only multi-line viewer with a copy button and an optional download button when fileName is set. Replaces the legacy txtModal which the inbounds page used for every link export. - PromptModal.vue (shared): generic title + input/textarea + confirm callback, with the legacy keybindings (Enter submits in single-line mode; Ctrl+S submits in textarea mode). Used here for import-inbound but also by xray-config edits in Phase 6. - InboundsPage.vue: drops the toast stubs for `import`/`export`/`subs` on the general-actions menu and `export`/`subs`/`clipboard` on the per-row menu, routing each through openText / openPrompt + the appropriate model helper (genInboundLinks, etc.). The copyClients cross-inbound modal stays toast-stubbed — that's its own dedicated legacy modal worth its own commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-i — xray page scaffold + Advanced JSON tab The fifth and last legacy page comes online. Tabs are scaffolded with a-empty placeholders for the structured editors (Basics / Routing / Outbounds / Balancers / DNS) so navigation is stable; the Advanced (JSON) tab is fully functional and lets power users edit the raw xraySetting tree exactly like the legacy CodeMirror pane. - xray.html + src/xray.js: fifth Vite multi-page entry, mounted as XrayPage; vite.config.js routes /panel/xray and /panel/xray/ to it through the dev proxy bypass alongside the other pages. - XrayPage.vue: page chrome with the Save / Restart-xray bar, restart- output popover (surfaces /panel/xray/getXrayResult content when startup fails), 6 a-tabs, and a textarea-backed Advanced JSON editor. CodeMirror is intentionally not pulled in — the textarea works for every modern browser and keeps the bundle slim while structured editors land in 6-ii through 6-v. - useXraySetting.js composable: POST /panel/xray/ on mount, mirrors the settings-page 1s busy-loop dirty check for both xraySetting and outboundTestUrl, and exposes saveAll + restartXray. The dirty flag relies on string equality of the pretty-printed JSON, so reformat-only edits don't enable Save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-ii — xray Basics tab structured editor Replaces the placeholder on the Basics tab with a structured form for the most-touched fields of the xray template — outbound + routing strategy, log levels, traffic stat counters, and the "basic routing" shortcuts (block torrent / IPs / domains, direct IPs / domains, IPv4 forced, WARP / NordVPN routing). - useXraySetting.js: hoists a parsed `templateSettings` reactive alongside the JSON string, with two cooperating watches that keep them in sync. Editing structured fields stringifies into xraySetting for the dirty-poll + Advanced JSON tab; editing the JSON re-parses into templateSettings only when valid, so structured tabs stay readable mid-edit. - BasicsTab.vue: collapse panels mirror the legacy partial — General, Statistics, Logs, Basic routing. Every input is a computed v-model reading/writing into templateSettings; the routing-rule shortcuts funnel through ruleGetter/ruleSetter which match the legacy templateRuleGetter/templateRuleSetter behavior (replace-first, drop-duplicates, pop-the-rule-when-empty). Direct/IPv4 setters also call syncOutbound() to provision/prune the matching outbound. - XrayPage.vue: imports BasicsTab + derives `warpExist`/`nordExist` from the parsed templateSettings. WARP/NordVPN provisioning modals are still placeholders that toast — those land in 6-v with the routing/outbound editors. Default tab flips back to Basics so users land on the structured editor. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iii — xray Routing tab + rule modal Replaces the Routing tab placeholder with a full editor for templateSettings.routing.rules: - RoutingTab.vue: a-table over the parsed rules with the legacy six- column layout (action / source / network / destination / inbound / outbound) and the same "lead value + N more" pill renderer for multi-value criteria. Mobile drops source/network/destination for readability. Per-row dropdown handles edit / move-up / move-down / delete; the array-mutation reordering replaces the legacy jQuery Sortable drag handle without pulling in a sortable lib. - RuleFormModal.vue: full form mirroring xray_rule_modal.html — CSV inputs for sourceIP/sourcePort/vlessRoute/ip/domain/user/port, Network select, Protocol multi-select, Attrs key/value pairs, inbound-tag multi-select sourced from templateSettings.inbounds + parent inboundTags + dnsTag, outbound-tag single-select sourced from templateSettings.outbounds + clientReverseTags, and balancerTag from templateSettings.routing.balancers. Submit serializes via the same shape the legacy `getResult` produces (CSV → array, drop empty fields). - XrayPage.vue: imports RoutingTab and exposes inboundTags + clientReverseTags from useXraySetting so the modal can populate its tag pools. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-iv — xray Outbounds tab + outbound modal Replaces the Outbounds tab placeholder with a full table + add/edit flow. The 1.3k-line legacy outbound modal is condensed to a tabbed modal with structured Basics fields (tag/protocol/sendThrough/domain strategy) and JSON tabs for the protocol-specific settings + stream trees — same approach the Inbound modal uses, and a power user can still edit the same trees via the page-level Advanced (JSON) tab. - useXraySetting.js: adds fetchOutboundsTraffic + resetOutboundsTraffic + testOutbound. Test states are tracked per outbound index so the row's Test button can show loading + the Test-result column can render the response delay / status / error. - OutboundsTab.vue: full table (action / identity / address / traffic / test result / test) plus a card-list mobile variant with the same row dropdown (set-first / edit / move up/down / reset traffic / delete). outboundAddresses() reproduces the legacy findOutboundAddress logic so each protocol's host:port list is rendered consistently. Add/edit go through OutboundFormModal, delete goes through Modal.confirm, reset traffic posts to /panel/xray/resetOutboundsTraffic with the row's tag (or "-alltags-" from the toolbar). - OutboundFormModal.vue: tag/protocol/sendThrough/domainStrategy on the Basics tab; settings + streamSettings as raw JSON on their respective tabs. Tag-collision check happens client-side before emitting; malformed JSON aborts the save with a message.error. - XrayPage.vue: imports OutboundsTab and wires the test action to the composable's testOutbound helper. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-v — xray Balancers tab + DNS placeholder Brings Balancers to full parity with the legacy panel and adds a DNS tab placeholder that exposes the full dns/fakedns trees as JSON so users can edit them without falling through to Advanced. - BalancerFormModal.vue: tag (with duplicate-tag warning across other balancers), strategy (random/roundRobin/leastLoad/leastPing), selector tag-mode multi-select sourced from existing outbound tags + free-form additions, fallback. Disable-on-invalid is driven by the duplicateTag + emptySelector computed flags. - BalancersTab.vue: empty state with a single "Add balancer" CTA; populated state shows the legacy 4-column table (action / tag / strategy / selector / fallback) with per-row edit + delete in a dropdown. On submit the wire shape preserves the `strategy: { type }` nesting only when the strategy is non-default, matching the legacy emit. Tag renames also chase across routing.rules.balancerTag references so existing rules don't dangle. - DnsTab.vue: master enable switch + raw JSON for `dns` and `fakedns`. Legacy had a dedicated server-by-server editor + a fakedns row editor; both are big enough to deserve their own commits, and the JSON path supports every field today. WARP / NordVPN provisioning modals still toast as "coming soon" — those are third-party API integrations worth their own commits. The xray page now has structured editors for Basics / Routing / Outbounds / Balancers and JSON editors for DNS / Advanced — every xray tab the legacy panel offered is functional. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(server): Phase 8 — cut HTML routes over to web/dist/ Production cutover. Every user-facing HTML route now serves the Vue-3-built bundle from web/dist/ instead of rendering the legacy Go template; the long-hashed Vite assets are served at /assets/ from the same embedded filesystem. The legacy templates in web/html/ and the legacy static tree in web/assets/ are kept on disk for now in case a quick revert is needed, but nothing the binary serves references them. What changed: - web.go: a new //go:embed dist/* feeds the controller package via a SetDistFS hand-off before controller construction. The static /assets/ route is rebound: in dev to web/dist/assets/ on disk so Vite's incremental rebuilds show up live; in prod to the embedded dist via wrapDistFS (rooted one level deeper than wrapAssetsFS). - controller/dist.go: serveDistPage helper used by every HTML handler. Reads dist/<name> from the embedded FS and applies two transforms before sending: 1. injects <script>window.__X_UI_BASE_PATH__="..."</script> just before </head> so AppSidebar links resolve under the panel's basePath. 2. when basePath != "/", rewrites Vite's absolute /assets/ URLs to <basePath>assets/ so installs running under a custom URL prefix load the bundle where the static handler lives. HTML responses go out with no-cache so panel upgrades reach users on the next refresh; hashed JS/CSS stays cacheable. - controller/index.go: IndexController.index now serves dist/login.html for logged-out callers (the redirect for logged-in users is unchanged). - controller/xui.go: XUIController.{index,inbounds,settings,xraySettings} each become a one-line wrapper around serveDistPage. Smoke checklist for the maintainer: - run `cd frontend && npm run build` to refresh web/dist/ before building the Go binary (the embed snapshot is taken at compile time); - visit /panel/, /panel/inbounds, /panel/settings, /panel/xray and confirm each loads its Vue page; - log out and log back in to verify the login flow; - confirm the sidebar links navigate correctly under your install's basePath; - POST flows (e.g. saving settings) still need the CSRF token — that endpoint (/panel/csrf-token, added earlier) is unchanged. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 6-vi — WARP + NordVPN provisioning modals Replaces the toast stubs on the Basics tab and Outbounds toolbar with the legacy WARP + NordVPN provisioning flows. Both modals now stage their wireguard outbounds back into templateSettings.outbounds through the same event channels OutboundsTab uses, so the existing add / reset / delete / refresh-traffic surface keeps working. - WarpModal.vue: empty state shows a single Create button that generates a wireguard keypair locally (Wireguard.generateKeypair) and posts it to /panel/xray/warp/reg; populated state surfaces the access_token / device_id / license_key / private_key, lets the user upgrade to WARP+ via /panel/xray/warp/license, refreshes the account info from /panel/xray/warp/config (plan / quota / usage in human-readable bytes), and stages a wireguard outbound with the WARP-specific reserved-byte encoding pulled from client_id. Add / Reset / Delete go through events the parent routes back to templateSettings.outbounds. - NordModal.vue: dual-tab login (NordVPN access token → /panel/xray/nord/reg, or paste a NordLynx private key → /panel/xray/nord/setKey). Once authenticated, country / city / server selectors fetch from /panel/xray/nord/{countries,servers}, servers sort by load ascending, the lowest-load server in the current city auto-selects. Reset emits oldTag/newTag so the parent renames matching routing rules in place; logout emits a remove-routing-rules event with prefix `nord-` to purge any dangling references. - XrayPage.vue: holds warpOpen / nordOpen flags, ensures the outbounds array exists before mutating it, and wires the modal events (add-outbound / reset-outbound / remove-outbound / remove-routing-rules) to in-place edits of templateSettings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): Phase 7 — vue-i18n wired up + login page translated Sets up vue-i18n on top of the panel's existing TOML translation files. The Go side stays the source of truth — translators continue to edit web/translation/*.toml; a sync script snapshots those files into per-locale JSON the Vue bundle imports. The login page is translated end-to-end as a worked example; remaining pages can be converted incrementally without infrastructure churn. What's in the box: - scripts/sync-locales.mjs: small TOML→JSON converter that walks web/translation/*.toml and writes frontend/src/locales/<code>.json. Handles the narrow subset of TOML the panel uses (flat key/value pairs + dotted [section.subsection] heads). Wired as a `prebuild` + `predev` script so production builds always include the latest strings without a manual step. - src/i18n/index.js: createI18n() in composition mode with all 13 locales emitted as their own Vite chunks. The active locale (read from the same `lang` cookie LanguageManager has always managed) plus the en-US fallback are eagerly loaded; the rest are dynamically importable via a loadLocale(code) helper. This keeps the per-page bundle the user actually downloads small — only ~30 KB of strings end up in the initial payload, vs ~220 KB if all 13 were eager. - All five page entries (index/login/settings/inbounds/xray) wire the i18n plugin into createApp via .use(i18n). - LoginPage.vue: t(...) replaces hardcoded English on the username / password / 2FA placeholders, the submit button label, and the Settings popover title. The Hello/Welcome headline cycle stays hardcoded — those are stylistic, not labels. The 'Hello'/'Welcome' cycle stays in English deliberately; the rest of the migration's components still ship hardcoded English and will be converted page by page in follow-up commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate page chrome — sidebar, save bars, tabs, summary cards Replaces hardcoded English with t() calls in the components every user sees on every page load. The translations themselves come from the existing TOML files via the sync script — no new strings, no new locale keys. Per component: - AppSidebar.vue: 5 menu titles (dashboard / inbounds / settings / xray / logout). Computed so the sidebar re-renders when the cookie-driven locale flips on reload. - IndexPage.vue: Quick actions card title + Logs / Backup / Up-to- date / Update buttons. - StatusCard.vue: CPU / Memory / Swap / Storage labels + logical-processors / frequency tooltips. - XrayStatusCard.vue: card title + error popover header + Stop / Restart / Switch xray action labels (kept the v-prefix version string as-is — it's content, not a label). - SettingsPage.vue: 5 tab titles + Save / Restart-panel buttons + unsaved-changes warning. - XrayPage.vue: 6 tab titles + Save / Restart-xray buttons + unsaved-changes warning. - InboundsPage.vue: 5 summary-stat card titles. - InboundList.vue: 10 column titles (computed for live locale), Add inbound / General actions buttons + every dropdown menu item, search placeholder, filter radio labels, popover titles (disabled / depleted / depleting / online), traffic + info popover row labels. Total: ~75 strings localised across 8 files. The remaining English labels live in the per-tab settings forms, the form modals (Inbound / Client / Outbound / Rule / Balancer / WARP / Nord), and the per-row table cell helpers — all incremental work that doesn't touch infrastructure. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): translate every remaining English string on the index page Closes the index page's i18n coverage. Combined with the page-chrome commit, every label users see on the dashboard is now sourced from the TOML translation files. Per file: - IndexPage.vue: loading-spinner tip (initial + dynamic). - BackupModal.vue: modal title, both list-item titles + descriptions ("Back up" / "Restore"), in-flight busy tips ("Importing database…" / "Restarting panel…"). - PanelUpdateModal.vue: modal title, update-available alert, current/latest version row labels, "Up to date" tag + label, primary action button. Modal.confirm now uses the translated panelUpdateDialog / panelUpdateDialogDesc with #version# substitution; success toast uses panelUpdateStartedPopover. - LogModal.vue: title slot ("Logs"). The Debug/Info/Notice/Warning/ Error log-level options stay literal — they're xray's wire values, not user-facing labels (matches the existing settings-page choice). - XrayLogModal.vue: title + Filter label. Direct/Blocked/Proxy stay literal for the same reason. - VersionModal.vue: modal title + xray-switch alert + per-file tooltip + "Update all" button + custom-geo collapse header. The Modal.confirm flows for switchXrayVersion + updateGeofile use translated dialog/desc with #version# / #filename# substitution. - CpuHistoryModal.vue: title slot. - CustomGeoSection.vue: routing-hint alert, Add / Update-all buttons, every column title (computed for live locale), copy/edit/download/ delete tooltips, copy toast, delete-confirm modal, empty-state text. - CustomGeoFormModal.vue: add/edit titles, OK/cancel labels, Type/ Alias/URL field labels, alias placeholder, all three validation toasts. Total: ~50 strings localised across 8 index-page files. The Hello / Welcome login headline cycle and a handful of literal xray wire values (Direct/Blocked/Proxy/log levels) are intentionally kept hardcoded. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(frontend): Phase 7-c — translate settings, inbounds modals, xray tabs Continues the page-by-page translation pass started in cb37dd55 — runs every user-visible string on settings (General/Security/Telegram/Sub), inbounds (Client/QR/Info modals), and xray (Routing/Balancer/Rule/Warp/ Nord/Basics/Outbounds tabs) through useI18n. Updates the TOML→JSON sync script to escape `@` (vue-i18n parses it as a linked-format prefix) and refreshes all 13 locale files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): Phase 9 — restore index dashboard, fix login/CSRF, port legacy styles - Index dashboard regains the 8 cards that were lost in the SPA port (3X-UI panel info, Operation Hours, System Load, Usage, Overall Speed, Total Data, IP Addresses, Connection Stats), plus a Config button that shows the live xray config.json. Version display falls back through panelUpdateInfo → window.__X_UI_CUR_VER__ → '?' so dev mode isn't blank. - Xray config no longer hangs on load: useXraySetting surfaces failures instead of leaving a perpetual spinner, and the Vite dev proxy stops hijacking POST requests to migrated routes (only GETs get bypassed). - Inbound page no longer throws __asyncLoader/emitsOptions errors — inbound.js was missing imports (NumberFormatter, SizeFormatter, Wireguard) and InboundList kept emitting after unmount. - Login round-trip works after logout: a public /csrf-token endpoint bootstraps the SPA before authentication, axios caches the token module-level, and the dev 401 handler navigates to /login.html instead of reloading the dashboard into a redirect loop. - legacy.css mirrors the legacy panel's surface/text variables so dark and ultra-dark themes match main; every SPA entry imports it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray DNS section to match main branch DnsTab now exposes every field the legacy panel did — top-level toggles (tag, hosts, queryStrategy, disableCache/queryConcurrency, fallback strategy, client subnet), the servers table with per-row strategy and domain/expectIP/unexpectedIP overrides, and the Fake DNS pool. The new DnsServerModal covers the full add/edit flow and collapses to a bare string when the user only sets an address — matching the wire shape the legacy form emits for plain DNS entries like "8.8.8.8". Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): rebuild xray outbound modal with structured per-protocol forms Replaces the JSON textareas with the same shape the legacy panel uses: all 11 outbound protocols (vmess/vless/trojan/shadowsocks/socks/http/ mixed/wireguard/tun/dns/loopback/blackhole/freedom) get dedicated fields, every transport (TCP/KCP/WS/gRPC/HTTPUpgrade/XHTTP) gets its own panel, and TLS/Reality/sockopt/Mux are configured through the same controls as the inbound side. Brings the SPA outbound editor to parity with main so users no longer have to drop into raw JSON. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): bring inbound modal to full parity with main branch Switches the default protocol on add to VLESS, fixes a crash when adding a Mixed account (the constructor is SocksAccount, not MixedAccount), and fills in the fields the SPA was previously delegating to the Advanced JSON tab: - TLS: cipher suites, min/max version, reject SNI / disable system root / session resumption switches, the certificate array with per-row Path-or-Content toggle (Set Default pulls from /panel/setting/ defaultSettings), One Time Loading, Usage / Build Chain, plus ECH key/config with a Get New ECH Cert button. - Reality: xver, target/SNI sync icons (uses getRandomRealityTarget), max time diff, min/max client version, short IDs randomizer, SpiderX, mldsa65 seed/verify with Get New Seed. - Stream: full structured forms for every transport — TCP HTTP camouflage gets its request/response editor, mKCP gets MTU/TTI/uplink/ downlink/CWND/maxSendingWindow, WebSocket / gRPC (now with Authority) / HTTPUpgrade get headers + proxy-protocol toggles, XHTTP gets the full SplitHTTPConfig surface (mode-aware fields, padding obfs, session/sequence placement, uplink data, no-SSE). - New External Proxy section and a structured Sockopt block (mark, TCP keepalive/timeout/clamp, fast open, MPTCP, penetrate, V6Only, domain strategy, congestion, TProxy, dialer/interface, trusted XFF). - VLESS gets the legacy X25519 / ML-KEM-768 buttons that fetch fresh decryption/encryption blocks via /panel/api/server/getNewVlessEnc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): add FinalMask UI (TCP/UDP masks + QUIC params) to inbound and outbound Mirrors web/html/form/stream/stream_finalmask.html as a shared FinalMaskForm component used by both modals — they share the same StreamSettings shape (addTcpMask/addUdpMask/finalmask/enableQuicParams) so a single template handles both. Surfaces: - TCP masks for raw/tcp/httpupgrade/ws/grpc/xhttp networks: fragment, sudoku, and header-custom (with the 2D clients/servers groups, each row supporting array/str/hex/base64 packets and a randomize button for base64). - UDP masks for hysteria protocol or kcp network: hysteria gets just salamander; kcp gets the full type list (mkcp variants, header-*, xdns/xicmp, header-custom with flat client/server lists, and noise). Switching to xdns shrinks the kcp MTU to 900 to match the legacy panel's behavior. - QUIC Params for hysteria or xhttp: congestion (incl. brutal up/down fields), debug, UDP hop ports/interval, idle/keepalive timeouts, path-MTU discovery toggle, and the four receive-window tunables. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): remove duplicate Outbound test URL from xray Advanced tab The Basics tab already exposes this field through BasicsTab — duplicating it on the Advanced tab let two inputs race the same ref and only added clutter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): unify theming on vanilla AD-Vue light/dark/ultra-dark The legacy panel CSS (custom.min.css ported as legacy.css) tinted every non-primary button teal-green via .dark .ant-btn:not(.ant-btn-primary) overrides while AD-Vue 4's darkAlgorithm kept primary buttons blue — producing the mixed blue/green button look on dark mode. Drop legacy.css entirely and let AD-Vue 4's algorithms own the palette. Centralize antdThemeConfig in useTheme.js so every page resolves to the same source of truth (light = defaultAlgorithm, dark = darkAlgorithm, ultra-dark = darkAlgorithm + deeper colorBgBase/Layout/Container/ Elevated tokens). Each page's <a-config-provider> now imports the shared computed instead of defining its own copy. Drops the 67 KB legacy CSS chunk; per-page CSS bundles fall to ≤5.9 KB. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): restore computed import in Settings + Xray pages When 5f1aba28 dropped the local antdThemeConfig computed (now shared from useTheme), it also stripped `computed` from the import list — but both pages still call computed() elsewhere (confAlerts, advanced-tab helpers). Re-adds it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): retheme dashboard gauges to AD-Vue blue and shrink them - StatusCard's CPU/RAM/Swap/Storage dashboards rendered at AD-Vue's default 120px width which made the percent text balloon to ~36px. Drop to 90px (70px on mobile) so the gauge fits the rest of the card. - The CurTotal.color thresholds still hardcoded the legacy teal/orange palette (#008771 / #f37b24 / #cf3c3c). Switch to AD-Vue's primary / warning / danger tokens (#1677ff / #faad14 / #ff4d4f) so the gauges match the rest of the panel under both light and dark themes. - XrayStatusCard's running-animation badge ring also still pointed at the deleted --color-primary-100 var; hardcode the new primary blue. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: shorten backupTitle to "Backup & Restore" across all 13 locales The backup modal header was the second-longest title in the dashboard on every locale ("Database Backup & Restore" / "Резервне копіювання та відновлення бази даних" / etc). Drop the "Database / Veritabanı / 数据库" qualifier — the modal already lives under the "Database" column, so the shorter form reads cleaner on narrow viewports. Updated both the .toml source-of-truth files and the synced .json locales (re-running scripts/sync-locales.mjs). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: collapse two translation databases into a single web/translation/<lang>.json set The Vue SPA had been reading from frontend/src/locales/*.json while the Go binary still loaded web/translation/translate.*.toml — and a sync-locales.mjs pre-build step kept the two in lockstep, with TOML as the source of truth. Now that go-i18n v2.6.1 already flattens nested JSON via recGetMessages/addChildMessages, both runtimes can share one file per locale. - Move the 13 nested-JSON locale files to web/translation/<lang>.json so they live alongside the Go //go:embed translation/* directive. - Switch web/locale/locale.go from toml.Unmarshal to json.Unmarshal (and drop the pelletier/go-toml import — it's now indirect-only). Confirmed via a smoke test that pages.index.cpu, subscription.title, tgbot.commands.help, and menu.settings all resolve in en-US, fa-IR, ru-RU, and zh-CN. - Repoint Vue's i18n loader at the new path (../../../web/translation/ *.json glob) and drop the moved-here pathDelimiter comment that no longer applies. - Delete the 13 legacy translate.*.toml files and the sync-locales.mjs script + its npm pre-script hooks (predev/prebuild/i18n:sync). The Telegram bot and subscription page still get their messages because they were reading the same MessageIDs the JSON files now produce. - Update copilot-instructions.md so the next contributor knows where the canonical translation files live. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): redesign expand-row + retheme client visuals When you expanded an inbound row, the nested <a-table> inside ClientRowTable burst out of the parent's scroll-x box — its .ant-spin-container ended up wider than the parent's narrow .ant-table-cell, so the child looked oversized while the parent looked squeezed. Replace the nested table with a CSS-grid layout that owns its sizing, sits flush inside the expanded cell, and collapses to a 3-column layout on mobile (action menu, client identity, info popover). While in there, fix three other client-row visuals: - The Unicode infinity glyph (U+221E) renders as an "m"-shaped character in some system fonts (Windows Segoe UI in particular). Add a shared <InfinityIcon /> SVG component (legacy panel's path) and use it in ClientRowTable, InboundList, and InboundInfoModal — desktop and mobile cells. - The "unlimited quota" traffic bar passed :percent="100" with no stroke-color, so AD-Vue auto-coloured it success-green. Pin it to the AD-Vue purple token (#722ed1) so it reads as the no-limit sentinel rather than another usage state. - ColorUtils + the in-row statsExpColor still hardcoded the legacy teal/orange/red/purple palette (#008771 / #f37b24 / #cf3c3c / #7a316f). Map them onto AD-Vue 4's success/warning/danger/purple tokens (#52c41a / #faad14 / #ff4d4f / #722ed1) so badges, tags, and progress bars all match the rest of the panel. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): darken light-theme page bg so cards stand out The light-theme --bg-page was #f0f2f5 — close enough to AD-Vue's #fff card background that the cards faded into the page. Bump it to #e6e8ec (a more visibly distinct gray) so cards lift cleanly off the surface. Dark and ultra-dark stay where they were. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): shrink dashboard percent text and surface the unfinished arc Two follow-up tweaks to the dashboard gauges: - AD-Vue scales the percent text from the SVG, not from :width, so the 90px gauges still rendered the number at ~27px. Pin .ant-progress-text to 14px via :deep() and trim the gauge to 70px (60px on mobile) so the whole card stays compact. - The default trail (rgba(0,0,0,0.06) / rgba(255,255,255,0.08)) was invisible on the light-theme card. Pass an explicit rgba(128,128,128,0.25) trail-color so the unfinished portion is visible under both light and dark themes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): migrate subpage.html to Vue 3 SPA The subscription info page was the last page still rendered by Go templates. Move it to the Vite multi-page setup so the whole panel loads through one toolchain. Frontend: SubPage.vue mounts at /sub/<id>?html=1 and reads window.__SUB_PAGE_DATA__ for the parsed view-model (traffic / quota / expiry + rendered share links). Fix descriptions borders against the light-theme card by painting the row divider on each cell's bottom edge — AD-Vue's <tr> border doesn't render reliably under border-collapse:collapse. Backend: serveSubPage reads dist/subpage.html, injects window.__X_UI_BASE_PATH__ + window.__SUB_PAGE_DATA__ before </head>, and rewrites Vite's absolute /assets/ URLs when the panel runs under a URL prefix. Drop the legacy template-FuncMap wiring and switch the sub server's static mount from web/assets to web/dist/assets. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): inbound modal QR + tabs + restored TLS fallbacks Per-client QR action: the qr icon on the expand-row table opened the big info modal instead of the QR modal. Route it to QrCodeModal and extend that modal with a `client` prop so genAllLinks() produces the per-client share URLs (and per-peer remarks for WireGuard). Inbound's Data redesign: split the dense single-page view into three tabs — Inbound, Client, Subscription. Drop every QR rendering from this modal (QrCodeModal is the QR home now). Each row in the Inbound tab is one label/value pair instead of the legacy 2-column grid, and long values like the VLESS encryption blob render as a wrapping code block with a copy button so they can't blow out the dialog. The Subscription tab renders sub URL + JSON URL as clickable anchors that open in a new tab. Restored TLS fallbacks UI: the model already exposed VLESSSettings.Fallback / TrojanSettings.Fallback with addFallback / delFallback / fallbackToJson, but the form modal never surfaced them during the Vue 3 migration. Re-add the legacy form (SNI, ALPN, Path, Destination, PROXY) on the protocol tab, gated on TCP transport plus (for VLESS) encryption=none — same conditions as main. Column widths: Protocol 70→130 and All-time Traffic 60→95 in the inbound list; All-time Traffic 90→130 in the client expand-row, so the header text fits and tags don't get squeezed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): navy dark theme + rounded inbound/client corners Dark theme picks up a refined navy palette (page #0a1426, cards #142340, sider #0d1d33) so the sidebar blends with the rest of the surface; ultra-dark stays neutral black. Resolves the previous mismatch where AD-Vue 4 hardcoded #001529 / #002140 for the sider, trigger and dark Menu items via Layout.colorBgHeader / colorBgTrigger and Menu's colorItemBg — overrides go through the component-token map now. Round the inbound table's outer corners (header start/end + last row end) and wrap the client expand-row grid in a 1px / 8px-radius border so the list reads as a contained block instead of a flush rectangle. Linter-driven whitespace cleanup across inbounds/*.vue rolled into the same commit since it can't be split out cleanly. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): xray tab fixes — modal close, tag validation, full XHTTP, reset to default Modal close: BalancersTab / OutboundsTab / RoutingTab confirmDelete used arrow expressions that returned splice's removed-items array. AD-Vue 4 treats truthy non-thenables from onOk as "still pending" and never closes the dialog (see ActionButton.js:103-106), so the confirm modal stayed open. Wrap the body so onOk returns undefined and AD-Vue auto-closes. Tag validation: outbound + balancer modals only flipped between warning/success on duplicate, leaving the empty case as a green ✓. Split into a 3-state computed — error (empty) / warning (duplicate) / success — and wire a help message so the input clearly explains why the OK button is disabled. Reset to default: re-add the legacy "Reset to Default" panel at the bottom of BasicsTab. Calls /panel/setting/getDefaultJsonConfig and overwrites templateSettings; the existing watch re-stringifies so the JSON tab + dirty-poll see the new state. Restored Basics option lists from main: IPs (4→10, +Vietnam/Spain/ Indonesia/Ukraine/Türkiye/Brazil), DomainsOptions (4→10, +regex entries), BlockDomainsOptions (5→17, +Malware/Phishing/Adult/regex), ServicesOptions (Reddit/Speedtest in, off-template Microsoft out). Outbound form parity with main: • Reverse Sniffing UI for VLESS — toggle + destOverride checkboxes (HTTP/TLS/QUIC/FAKEDNS) + Metadata/Route Only + IPs/Domains excluded multi-selects, gated on reverseTag being set. • Full XHTTP transport — request headers list, Max Upload Size / Min Upload Interval (packet-up), Padding Obfs Mode + sub-fields, Uplink HTTP Method, Session/Sequence/UplinkData placement + keys, No gRPC Header (stream-up/stream-one), expanded XMUX with Max Concurrency/Connections/Reuse/Request/Reusable/Keep-alive. Strip a-divider from the outbound form per request — replaced with plain section/item heading divs so the labels and per-row delete icons stay but the horizontal rule is gone. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): xray Advanced tab parity + finalmask gating Advanced tab was a single textarea bound to the full xraySetting blob. Restore the legacy 4-way view: a radio group toggles between All / Inbounds / Outbounds / Routing Rules, and the textarea reads/writes the matching slice through templateSettings. Added the legacy header ("Advanced Xray Configuration Template" + description) so the page introduces itself like main. Outbound finalmask leaked into protocols that don't have a stream (Freedom / Blackhole / DNS / Socks / HTTP / Wireguard) because the v-if only checked outbound.stream. Gate the whole FinalMaskForm on outbound.canEnableStream() to match main. Drop the leading divider inside FinalMaskForm — its parent already provides separation, so the rule above "TCP Masks" was redundant. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound Advanced tab live mirror + QR exact-fit sizing Advanced tab in the inbound modal showed stale state. The watch only refreshed advancedJson.stream, so toggling the Sniffing switch in the Sniffing tab left the Advanced JSON showing the prior value. And encryption — stored on inbound.settings.encryption, not on stream — never appeared at all because Advanced only exposed stream + sniffing. Split the watch into three (stream / sniffing / settings) and add a settings textarea so encryption / clients / fallbacks live alongside the existing two views. The submit() path now reads settings from the JSON tab too (falling back to inbound.settings.toString()) so power-user edits in Advanced override the structured form on save. QR canvas: when a longer share-URL bumps the QR matrix size, QRious falls back to floor(canvasSize / matrixWidth) and centers the pattern, leaving a white margin (e.g. matrix=41, size=180 → 8px gap). Pre-pick the QR version from the URL byte length and set canvas size to a multiple of matrixWidth × pixelSize so the pattern always fills it edge-to-edge — no white margin even after toggling encryption on. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound stream tidy-up + QR sizing + dev proxy Stream tab clean-up: drop the seven a-divider rules in the inbound form's Stream tab — replace the labelled ones (Request / Response / Security) with a section-heading div that matches the outbound modal, delete the empty rules above TLS sub-blocks / External Proxy / Sockopt. Empty header-list form-items also leaked margin space below each "Add header" button across TCP / WS / HTTPUpgrade / XHTTP — gate each on headers.length > 0 so they vanish until the user adds one. QR panel: drop the link text under the canvas (the user already has a copy button on the header). Pin the canvas display size to a fixed 240px square via :style + image-rendering: pixelated/crisp-edges so a dense WireGuard config QR and its sparser link share the same on-screen footprint without blurring. Dev proxy: Node's AggregateError wraps connection failures whenever DNS returns more than one address (::1 + 127.0.0.1) and the code lands on the inner errors, not the outer. The existing handler only checked err.code so the ECONNREFUSED stack still spammed the log when the Go backend was down. Walk err.errors too, print one friendly line ("backend not reachable — start the Go server"), then stay quiet for the rest of the session. Vendor splitting + chunk-size warning: split node_modules into stable vendor-* chunks so each page only ships the deps it uses and the browser caches them across versions. ant-design-vue stays as a single chunk because its components share internals; raise the chunk-size warning to 1500kB so the build stays quiet (its 1.4MB minified gzips to ~410kB on the wire). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): info-modal cleanup + 2FA QR + outbound link import - 2FA QR: matrix-snap canvas + opaque background to drop white margin - Inbound info modal: stack Mixed/HTTP/Tunnel as info-rows, hide tab strip when only the Inbound tab applies - Add inline VLESS Reverse tag input on first-client form - Hide Protocol tab for TUN (no form yet) - Outbound link converter: route through Outbound.fromLink so vless/trojan/ss/hysteria(2) imports work alongside vmess; fix stray implicit global in fromLink Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): jalali calendar + drop legacy moment-jalali - Wire Calendar Type setting to a real Jalali datepicker via vue3-persian-datetime-picker, gated by useDatepicker composable - DateTimePicker wrapper swaps between AD-Vue and Persian picker; keeps dayjs v-model contract so existing forms/setters work unchanged - Theme picker popup explicitly per body.dark / data-theme=ultra-dark (AD-Vue 4 doesn't expose CSS vars, so var() fallbacks defaulted to white); fix invisible disabled days, SVG arrow fills, popup clipping via append-to="body" - Replace stray moment() calls in dbinbound/inbound models with dayjs; the legacy global was undefined under ESM and broke the inbounds list whenever any inbound had expiryTime > 0 - Remove legacy moment-jalali / persian-datepicker / aPersianDatepicker assets — replaced by the Vue 3 picker Note: dark/ultra background of the date popup still renders white in some cases — pending follow-up. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): jalali popup theming + full-month layout - Re-prefix popup selectors with .vpd-wrapper (popup root that travels with appendTo='body'), not .vpd-main (which stays at the input); paints the popup's dark/ultra background again - Drop the 1px border on .vpd-content — with box-sizing: border-box it ate 2px from the day-row width, wrapping the 7th cell of every row and hiding days 18-31 of months that needed a 5th week Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat: render dates in Jalali when Calendar Type is jalalian - IntlUtil.formatDate accepts an optional calendar arg; appends the BCP-47 -u-ca-persian extension so Intl renders Jalali across all UI languages, not just fa-IR - Plumb the panel's datepicker setting into the SubPage via the Go injection (window.__SUB_PAGE_DATA__.datepicker) - Panel pages (inbound list/info, client row, xray log) read the same setting through the useDatepicker composable so the whole panel stays consistent Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(frontend): ultra-dark page tint + mobile-friendly inbound view - Drop --bg-page from #21242a (lighter than the cards) to #050505 in ultra-dark across index/sub/settings/inbounds/xray, so cards consistently elevate over the page - Hide the inline sider's children + collapse-trigger and zero its width below 768px; the floating drawer-handle remains the menu trigger - Inbounds page mobile pass: tighten content-area + card padding; flex-wrap the filter bar instead of stacking; shrink table cell padding so all 4 mobile columns fit; bump expand / action / info icon hit targets - Per-client expand row on mobile: soft-tinted rounded cards instead of hairline borders, larger action / info touch targets, more legible email typography, bigger status badge dot Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove legacy template + asset trees and dead Go template engine - Delete web/html/ entirely (page templates, form/, modals/, component/, common/, settings/) — every route is served from web/dist/ now via serveDistPage; nothing in the binary referenced these - Delete web/assets/ entirely (jQuery-era ant-design-vue, axios, moment, codemirror, qrcode/qs/uri/vue/otpauth, custom CSS, Vazirmatn font); Vite bundles all of this into web/dist/assets - Drop the Gin HTML template wiring: remove //go:embed assets + //go:embed html/*, the assetsFS/htmlFS vars, the wrapAssetsFS adapter, EmbeddedHTML / EmbeddedAssets exports, getHtmlFiles / getHtmlTemplate, the i18nWebFunc/funcMap and SetFuncMap call, and the dev/prod template-engine branch — only StaticFS for /assets/ is needed now - Remove dead html()/getContext() helpers and unused imports from web/controller/util.go (no c.HTML(...) callers remain) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(frontend): inbound expand chevron position + cpu history layout - Push the inbound table's expand chevron away from the left edge with margin-inline + cell padding so it isn't flush against the corner - Move "Timeframe: …" caption above the chart (was below); restore the line that the previous edit removed - Fix x-axis time labels being clipped at the bottom of the cpu chart — the offset (paddingTop+drawHeight+22 = 222) exceeded the SVG viewBox height (220); dropped to +14 so labels sit at y=214 with room for descenders - Move the SVG axis text colors out of <style scoped> into a global block — Vue's scoped CSS doesn't always hash-attribute SVG <text> descendants, so the dark-mode overrides via :global() weren't matching; bumped opacity 0.55 → 0.85 for legibility on navy/black Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(login): language picker in settings popover + fluid card sizing - Add language select alongside the theme switch (mirrors SubPage) - Bind headline to pages.login.hello / pages.login.title so the "Hello / Welcome" cycle re-translates with the active locale - Replace AD-Vue 5-breakpoint grid with clamp() sizing so the card scales smoothly instead of jumping ~33% at each breakpoint - Pin horizontal padding so input width stays stable on large viewports Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): organize entry HTML + bootstrap JS into folders - Move entry HTML files: frontend/*.html -> frontend/html/*.html - Move per-page bootstrap modules: src/{index,login,settings,inbounds,xray,subpage}.js -> src/entries/ - Update vite.config rollup inputs and dev-mode MIGRATED_ROUTES to /html/<page>.html - Build output now lands at web/dist/html/<page>.html - serveDistPage and subController updated to read from dist/html/ Cleans up the flat frontend/ root which previously interleaved 6 HTML files with package.json, README, src/, etc. The src/ root similarly gets rid of 6 entry .js files mixed in alongside api/, components/, models/, etc. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore: remove obsolete vue3 phase1 inventory doc The migration is well past phase 1 — the inventory doc has rotted and the live state lives in the codebase plus the plan files. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(frontend): merge utils/legacy.js into utils/index.js The barrel was a placeholder for an eventual split that hasn't happened. Collapsing the two files removes one layer of indirection and the misleading "legacy" name (the contents are still actively used by the migrated SPA). - Move all 930 lines from utils/legacy.js into utils/index.js - Delete utils/legacy.js - Update direct import in models/outbound.js to '@/utils' - Drop a stale legacy.js reference in InboundFormModal comment Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(frontend): keep entry HTML files at frontend/ root The earlier move to frontend/html/ made dev-mode URLs ugly (http://localhost:5173/html/index.html instead of plain /). The folder didn't add real value — it just hid 6 files behind a non-conventional layout. Reverting that piece while keeping src/entries/ (which is a genuine separation between page bootstrap and the rest of src/). - HTML files back at frontend/<page>.html - Vite rollupOptions.input + MIGRATED_ROUTES restored to flat paths - Build output is web/dist/<page>.html again - web/controller/dist.go and sub/subController.go read from dist/<name> Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): bump eslint to 10 + add flat config + clean lint warnings - Upgrade eslint 9.39 -> 10.3 and eslint-plugin-vue 9.33 -> 10.9 - Add eslint.config.js (flat config required by ESLint 10) with vue3-recommended rules, sensible defaults, and exemptions for the project's existing formatting style - Drop --ext from the lint script (removed in ESLint 10) - vue/no-mutating-props is left off because the form-modal pattern ports straight from Vue 2 (parent passes a reactive object, child mutates it); a real fix is an architectural rewire, separate task Lint warning cleanup: - utils/index.js: var -> let/const in the X25519 routines, replace obj.hasOwnProperty(...) with Object.prototype.hasOwnProperty.call(...) - Remove unused imports (reactive, ref, Inbound) in ClientFormModal, InboundInfoModal, QrCodeModal, DnsServerModal, OutboundFormModal, SubPage; remove unused locals (isClientOnline, ONLINE_GRACE_MS, fetchAll, isSocks, isHTTP, _antdAlgorithm) - XrayStatusCard: declare 'open-logs' on defineEmits (was emitted but not declared) - RuleFormModal: rename v-for var t -> tag (shadowed useI18n's t) - Drop stale eslint-disable directives (no-new, no-unused-vars) - OutboundsTab/InboundList: drop redundant initial null assigns - InboundInfoModal/OutboundFormModal: explicit eslint-disable for the intentional local-ref-shadows-prop pattern in modal drafts `npm run lint` now passes with 0 errors and 0 warnings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): one client identity across multiple inbounds via subId Lets the operator add the same email under the same subId to several inbounds. Xray reports traffic per email, so a single client_traffics row acts as the shared accumulator — no aggregation overhead, quota and expiry stay consistent. - Email validation allows duplicates only when subId matches - AddClientStat upserts via OnConflict DoNothing (idempotent on rerun) - Stat/IP rows survive client deletion when a sibling inbound still references the email - enrichClientStats tops up GORM-preloaded stats with rows whose inbound_id points at a sibling, so every panel view sees usage - disableInvalidClients cascades enable=false and syncs the row's total/expiry into every sibling JSON when the shared identity expires - DelDepletedClients removes the depleted client from all referencing inbounds, batched - Subscription services dedupe traffic by email so shared quota is counted once Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * docs(frontend): rewrite README for multi-page Vue 3 layout Reflects the current state — embedded build, per-route HTML entries, ESLint 10 flat config, src/ layout, and the steps to add a new page. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * build(frontend): drop deprecated rimraf/glob/inflight transitive deps vue3-persian-datetime-picker pinned moment-jalaali to ^0.9.4, which pulled rimraf@3 → glob@7 → inflight@1. inflight in particular leaks memory and is unmaintained. Override moment-jalaali to ^0.10.4 (same runtime API, dropped the legacy build deps) so npm install no longer warns and the dep tree is 12 packages lighter. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): multi-node panel orchestration (CRUD, deployment, traffic sync, sub per-node) - Node model + service + controller (/panel/api/nodes/*) with bearer-token apiToken auth - Heartbeat job @every 10s; status/latency/xrayVersion surfaced in Nodes UI - Runtime abstraction (Local + Remote) so inbound/client mutations target the inbound's owning node instead of always hitting the local xray - Inbounds gain optional NodeID; tag-based correlation with remote panel (no RemoteInboundID column needed) - NodeTrafficSyncJob @every 10s pulls absolute counters + online/lastOnline from each enabled+online node and writes them into central DB; 30s reset grace window prevents post-reset overwrite - Reset propagation to nodes (best-effort) on client/inbound/all reset paths - Subscription server uses node.Address for inbounds with NodeID, falling back to existing host resolution for local inbounds - Frontend: Nodes page, "Deploy to" select in inbound form, Node column on inbound list, hostOverride threaded through genAllLinks/QR/Info modals Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(stats): system history modal + per-node CPU/Mem trends across all locales Backend - web/service/metric_history.go: generic in-memory ring buffer with two singletons — system-wide (cpu/mem/netUp/netDown/online/load1/5/15) and per-node (cpu/mem) keyed by node id - ServerService.AppendStatusSample writes all 8 metrics every 2s on the same tick; AppendCpuSample/AggregateCpuHistory kept for back-compat - NodeService.UpdateHeartbeat appends cpu/mem only on online ticks so offline gaps render as missing data, not phantom dips - New routes: GET /panel/api/server/history/:metric/:bucket and GET /panel/api/nodes/history/:id/:metric/:bucket, both whitelisted Frontend - Sparkline component generalized: arbitrary value range (auto-scale when valueMax=null), pluggable yFormatter/tooltipFormatter for B/s, client counts, load averages - SystemHistoryModal replaces CpuHistoryModal with tabs for every metric; opened from a tag on the 3X-UI card next to Documentation - NodeHistoryPanel: expandable row on the Nodes table showing per-node CPU and Mem trends, refreshed every 15s Localization - Backfill systemHistoryTitle / trendLast2Min / pages.inbounds.{node, deployTo, localPanel} and the entire pages.nodes block (51 keys including statusValues + toasts) into all 11 non-en/fa locales: ar-EG, es-ES, id-ID, ja-JP, pt-BR, ru-RU, tr-TR, uk-UA, vi-VN, zh-CN, zh-TW Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(embed): include underscore-prefixed Vite chunks in dist FS go:embed silently excludes files whose names start with `_` or `.`, so the `_plugin-vue_export-helper-<hash>.js` chunk that Vite/rolldown emits for @vitejs/plugin-vue was missing from the production binary. First import at runtime hit a 404 and the SPA failed to mount — blank page on every page load, no error in the server logs because the asset 404 was just a static-handler miss. Switched the directive to `//go:embed all:dist` which keeps the same root layout but disables the underscore/dot exclusion rule. Dev mode was unaffected (it serves dist/assets/ from disk, not the embedded FS). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * ci: build frontend bundle before Go compile in release.yml + Dockerfile Phase 8 cut all panel HTML routes over to web/dist/ and embedded the Vite bundle into the Go binary via //go:embed all:dist. web/dist/ is .gitignored, so on a fresh CI checkout it doesn't exist — every Go build since Phase 8 has been failing with "pattern dist: no matching files found" or producing a binary that 404s on first asset request. release.yml: add a setup-node@v4 + npm ci + npm run build trio before the existing go build step in both the Linux matrix job (7 arches) and the Windows job. npm cache is keyed on frontend/package-lock.json. Dockerfile: add a node:22-alpine frontend stage that runs npm ci + npm run build and emits to /src/web/dist (via vite.config.js's outDir). The golang builder stage then COPY --from=frontend /src/web/dist into ./web/dist before the go build, so embed.FS sees the bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(ws): live updates on inbounds/xray/nodes pages, drop polling + manual refresh Replaces the legacy polling + manual-refresh model with WebSocket pushes across the three live-data pages. The hub already broadcast traffic / client_stats / outbounds; this wires the frontend to consume them and adds a new `nodes` channel for the heartbeat job's snapshot. Frontend - new useWebSocket composable: page-scoped singleton WebSocketClient, lifecycle-managed on/off, leaves disconnect to page-unload - inbounds: useInbounds gains applyTrafficEvent / applyClientStatsEvent / applyInvalidate that merge counters and online/lastOnline in place; InboundsPage subscribes; InboundList drops the auto-refresh popover, the refresh button, and the now-unused refreshing prop - xray outbounds: useXraySetting gains applyOutboundsEvent; XrayPage subscribes; OutboundsTab drops the refresh button + emit - nodes: useNodes gains applyNodesEvent and stops the 5s setInterval/visibilitychange polling; NodesPage subscribes; NodeList drops the refresh button and ReloadOutlined import Backend - web/websocket: new MessageTypeNodes + BroadcastNodes notifier - node_heartbeat_job: after wg.Wait(), reload the table once and BroadcastNodes(updated). Gated on websocket.HasClients() so a panel with no open browser doesn't spend the DB read Bug fixes spotted in this pass - websocket.js #buildUrl defaulted basePath to '' when the global was missing (dev mode), producing `ws://host:portws` and a SyntaxError on the WebSocket constructor. Fall back to '/' and ensure leading slash. - vite.config.js: forward /ws to ws://localhost:2053 with ws:true so dev (5173) reaches the Go backend's WebSocket - NodeFormModal: a-input-password's visibilityToggle is Boolean in AntD Vue 4; the v3-era object form (`{ visible, 'onUpdate:visible' }`) triggered a Vue prop-type warning. Drop the override (default true shows the eye icon and toggles internally) and remove the orphaned tokenVisible ref Translations - pages.inbounds.autoRefresh / autoRefreshInterval: removed from all 13 locales (UI gone) - pages.nodes.refresh: removed from all 13 locales (UI gone) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): hide Node column when no nodes are defined Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-09 15:38:48 +00:00
"ResetAllTraffics": "Đặt lại tất cả lưu lượng",
"SortedTrafficUsageReport": "Báo cáo sử dụng lưu lượng đã sắp xếp"
},
"answers": {
"successfulOperation": "✅ Thành công!",
"errorOperation": "❗ Lỗi Trong Quá Trình Thực Hiện.",
"getInboundsFailed": "❌ Không Thể Lấy Được Inbounds",
"getClientsFailed": "❌ Không thể lấy khách hàng.",
"canceled": "❌ {{ .Email }} : Thao Tác Đã Bị Hủy.",
"clientRefreshSuccess": "✅ {{ .Email }} : Cập Nhật Thành Công Cho Khách Hàng.",
"IpRefreshSuccess": "✅ {{ .Email }} : Cập Nhật Thành Công Cho IPs.",
"TGIdRefreshSuccess": "✅ {{ .Email }} : Cập Nhật Thành Công Cho Người Dùng Telegram.",
"resetTrafficSuccess": "✅ {{ .Email }} : Đặt Lại Lưu Lượng Thành Công.",
"setTrafficLimitSuccess": "✅ {{ .Email }} : Đã lưu thành công giới hạn lưu lượng.",
"expireResetSuccess": "✅ {{ .Email }} : Đặt Lại Ngày Hết Hạn Thành Công.",
"resetIpSuccess": "✅ {{ .Email }} : Giới Hạn IP {{ .Count }} Đã Được Lưu Thành Công.",
"clearIpSuccess": "✅ {{ .Email }} : IP Đã Được Xóa Thành Công.",
"getIpLog": "✅ {{ .Email }} : Lấy nhật ký IP Thành Công.",
"getUserInfo": "✅ {{ .Email }} : Lấy Thông Tin Người Dùng Telegram Thành Công.",
"removedTGUserSuccess": "✅ {{ .Email }} : Người Dùng Telegram Đã Được Xóa Thành Công.",
"enableSuccess": "✅ {{ .Email }} : Đã Bật Thành Công.",
"disableSuccess": "✅ {{ .Email }} : Đã Tắt Thành Công.",
"askToAddUserId": "Cấu hình của bạn không được tìm thấy!\r\nVui lòng yêu cầu Quản trị viên sử dụng ID người dùng telegram của bạn trong cấu hình của bạn.\r\n\r\nID người dùng của bạn: <code>{{ .TgUserID }}</code>",
"chooseClient": "Chọn một Khách hàng cho Inbound {{ .Inbound }}",
"chooseInbound": "Chọn một Inbound"
}
}
Feat/multi inbound clients (#4469) * feat(clients): add shadow tables for first-class client promotion Introduces three new GORM-backed tables (clients, client_inbounds, inbound_fallback_children) and a populate-only seeder that backfills them from each inbound's existing settings.clients JSON. Duplicate emails across inbounds auto-merge under one client row, with each field conflict logged. Existing services are unchanged and continue reading from settings.clients — this commit is groundwork only. * feat(clients): make clients+client_inbounds the runtime source of truth Adds ClientService.SyncInbound that reconciles the new tables from each inbound's clients list whenever existing service paths mutate settings.clients. Wires it into AddInbound, UpdateInbound, AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, DelDepletedClients, autoRenewClients, and the timestamp-backfill path in adjustTraffics, plus DetachInbound on DelInbound. GetXrayConfig now builds settings.clients from the new tables before writing config.json, and getInboundsBySubId joins through them instead of JSON_EACH on settings JSON. Live Xray config and subscription endpoints are now driven by the relational view; settings.clients JSON stays in step as a side effect of every write. * feat(clients): add top-level Clients tab and CRUD API Adds /panel/api/clients endpoints (list, get, add, update, del, attach, detach) backed by ClientService methods that orchestrate the per-inbound Add/Update/Del flows so a single client row is created once and attached to many inbounds in one operation. The frontend gains a dedicated Clients page (frontend/clients.html + src/pages/clients/) with an AntD table, multi-inbound attach modal, and full CRUD. Axios interceptor learns to honour Content-Type: application/json so the JSON endpoints work alongside the legacy form-encoded ones. The legacy per-inbound client modal stays untouched in this PR — both flows now write to the same source of truth. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): add Port-with-Fallback inbound type Adds a new "portfallback" protocol that emits as a VLESS-TLS inbound under the hood but is paired with a sidecar table of child inbounds. Panel auto-builds settings.fallbacks at Xray-config-gen time from the sidecar — each child's listen+port becomes the fallback dest, with SNI/ALPN/path/xver match criteria pulled from the row. No more typing loopback ports by hand or keeping settings.fallbacks in sync. Backend: new FallbackService (Get/SetChildren, BuildFallbacksJSON); two new routes (GET/POST /panel/api/inbounds/:id/fallbackChildren); xray.GetXrayConfig injects fallbacks for PortFallback inbounds; the inbound model emits protocol="vless" so Xray accepts the config. Frontend: PORTFALLBACK joins the protocol dropdown; selecting it shows the standard VLESS controls plus a Fallback Children table (inbound picker + per-row SNI/ALPN/path/xver). Children are loaded on edit and replaced atomically on save. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reset Traffic, QR Code, Info actions + Online/Remaining columns The Clients page table gains: - Online column — green/grey tag driven by /panel/api/inbounds/onlines, polled every 10s. - Remaining column — bytes-remaining tag, coloured green/orange/red against quota, purple infinity when unlimited. - Action icons per row: QR, Info, Reset traffic, Edit, Delete. ClientInfoModal shows the full client detail (uuid/password/auth, traffic ↑/↓ + remaining + all-time, expiry absolute + relative, attached inbounds chip list, online + last-online). ClientQrModal fetches links for the client's subId via /panel/api/inbounds/getSubLinks/:subId and renders each one through the existing QrPanel component. Reset Traffic confirms then calls the existing per-inbound endpoint on the client's first attached inbound (the traffic row is keyed on email globally, so any attached inbound resets the shared counter). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): expose Attached inbounds in edit mode The multi-select was gated on add-only, so editing a client had no way to change which inbounds it belonged to. The picker now shows in both modes, and on submit the modal diffs the picked set against the original attachedIds — additions go through the /attach endpoint, removals through /detach, both after the field update lands so the new attachments get the latest values. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): unbreak template parsing + stale i18n keys - InboundFormModal: split the multi-line help string in the PortFallback section onto one line — Vue's template parser was bailing on Unterminated string constant because a single-quoted literal spanned two lines inside a {{ }} interpolation. - ClientInfoModal: t('disable') was missing at the root level, so vue-i18n returned the key path literally. Use t('disabled') which exists. - Linter cleanup elsewhere: pages.client.* references renamed to pages.clients.* to match the merged i18n block; whitespace normalisation in a few unrelated Vue templates. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * 1 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(traffic): drop all-time traffic tracking Removes the AllTime field from Inbound and ClientTraffic and migrates existing DBs by dropping the all_time columns on startup. The counter duplicated up+down without adding signal, and the per-event accumulator ran on every traffic write. Frontend: drop the All-time column from the inbound list and the client-row table, the All-time row from the client info modal, and the All-Time Total Usage tile from the inbounds summary card. The allTimeTraffic/allTimeTrafficUsage i18n keys are removed across every locale. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): mobile cards, multi-select, bulk add Adds the same row-card layout the inbounds page uses on mobile: the table is suppressed under the mobile breakpoint and each client renders as a compact card with a status dot, email, Info button, Enable switch, and overflow menu. All the per-client detail (traffic, remaining, expiry, attached inbounds, flow, created/updated, URL, subscription) opens through the existing info modal. Multi-select with bulk delete wires AntD row-selection on desktop and a per-card checkbox on mobile; a Delete (N) button appears in the toolbar when anything is selected. Bulk add reuses the five email-generation modes from the inbound bulk modal but takes a multi-inbound picker so one bulk run can attach to several inbounds at once. Submits client-by-client through the existing /panel/api/clients/add endpoint. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): remove legacy per-inbound client UI Now that clients live as first-class rows attached to one or many inbounds, the per-inbound client UI on the inbounds page is dead weight — every client action either has a global equivalent on the Clients page or makes no sense in a many-to-many world. Deletes ClientFormModal, ClientBulkModal, CopyClientsModal, and ClientRowTable from inbounds/. Strips the matching emits, refs, handlers, and dropdown menu items from InboundList and InboundsPage, and removes the dead mobile expand-chevron state and the desktop expanded-row plumbing that drove the inline client table. The InboundFormModal Clients tab still works in add-mode (one inline client at inbound creation) — that flow goes through ClientService. SyncInbound on save and remains useful. Fixes a stray "</a-dropdown>" left over by an earlier toolbar edit in ClientsPage that broke the template parser. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Delete depleted action Mirrors the legacy delDepletedClients action that lived under the inbounds page, but as a first-class /panel/api/clients/delDepleted endpoint backed by ClientService. The new path goes through ClientService.Delete for each depleted email, so the new clients + client_inbounds + xray_client_traffic tables stay consistent. Adds a danger-styled toolbar button on the Clients page (next to Reset all client traffic) with a confirm dialog and a toast reporting the deleted count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): move every client-shaped endpoint off /inbounds onto /clients After the multi-inbound client migration, client state belongs to the client API surface, not the inbound one. Twelve routes that were crammed under /panel/api/inbounds/* now live where they belong, under /panel/api/clients/*. Moved (route, handler, doc): POST /clientIps/:email POST /clearClientIps/:email POST /onlines POST /lastOnline POST /updateClientTraffic/:email POST /resetAllClientTraffics/:id POST /delDepletedClients/:id POST /:id/resetClientTraffic/:email GET /getClientTraffics/:email GET /getClientTrafficsById/:id GET /getSubLinks/:subId GET /getClientLinks/:id/:email Their /clients/* counterparts are: POST /clients/clientIps/:email POST /clients/clearClientIps/:email POST /clients/onlines POST /clients/lastOnline POST /clients/updateTraffic/:email POST /clients/resetTraffic/:email (email-only, fans out) GET /clients/traffic/:email GET /clients/traffic/byId/:id GET /clients/subLinks/:subId GET /clients/links/:id/:email per-inbound resetAllClientTraffics and delDepletedClients are dropped entirely — the Clients page already exposes global Reset All Traffic and Delete depleted actions, and per-inbound resets are meaningless once a client can be attached to many inbounds. ClientService.ResetTrafficByEmail is the new email-only reset path: it looks up every inbound the client is attached to and pushes the counter reset + Xray re-add through inboundService.ResetClientTraffic for each one, so depleted users come back online instantly. Frontend callers (ClientsPage, useClients, ClientQrModal, ClientInfoModal, InboundInfoModal, InboundsPage, useInbounds) all switched to the new paths. The Inbounds page drops its per-inbound "Reset client traffic" and "Delete depleted clients" dropdown items — users do those at the client level now. api-docs is rebuilt to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): switch tgbot + ldap callers to ClientService Adds two thin helpers to ClientService (CreateOne, DetachByEmail) and rewrites tgbot.SubmitAddClient and ldap_sync_job to call ClientService directly. Removes the JSON-blob payloads (BuildJSONForProtocol output for add, clientsToJSON/clientToJSON helpers) that callers previously fed to InboundService.AddInboundClient/DelInboundClient. ldap_sync_job.batchSetEnable now loops InboundService.SetClientEnableByEmail per email instead of trying to coerce AddInboundClient into doing the update — the old path would have failed duplicate-email validation for existing clients anyway. The legacy InboundService.AddInboundClient/UpdateInboundClient/ DelInboundClient methods stay in place; they are now only used internally by ClientService Create/Update/Delete/Attach. Inlining + deleting them follows in a separate commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(service): move all client mutation methods to ClientService Moves the client mutation surface out of InboundService and into ClientService. These methods all operate on a single client (identity fields, traffic limits, expiry, ip limit, enable state, telegram tg id) and didn't belong on the inbound aggregate. Moved (12 methods): AddInboundClient, UpdateInboundClient, DelInboundClient, DelInboundClientByEmail, checkEmailsExistForClients, SetClientTelegramUserID, checkIsEnabledByEmail, ToggleClientEnableByEmail, SetClientEnableByEmail, ResetClientIpLimitByEmail, ResetClientExpiryTimeByEmail, ResetClientTrafficLimitByEmail. Each method now takes an explicit *InboundService for the helpers that legitimately stay on InboundService (GetInbound, GetClients, runtimeFor, AddClientStat / UpdateClientStat / DelClientStat, DelClientIPs / UpdateClientIPs, emailUsedByOtherInbounds, getAllEmailSubIDs, GetClientInboundByEmail / GetClientInboundByTrafficID, GetClientTrafficByEmail). Stays on InboundService: ResetClientTrafficByEmail and ResetClientTraffic(id, email) — these mutate xray_client_traffic rows, not client identity, so they're inbound-side bookkeeping. Callers updated: tgbot (6 calls), ldap_sync_job (1 call), InboundService internal (writeBackClientSubID, CopyInboundClients, AddInbound's email-uniqueness check), ClientService Create/Update/ Delete/Attach/Detach. Also removes a dead resetAllClientTraffics controller handler whose route was already gone after the previous /clients API migration. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): finish migrating to ClientService + tidy IP routes Two related cleanups in the new /clients surface: 1. Move ResetAllClientTraffics (bulk-reset of xray_client_traffic + last_traffic_reset_time, with node-runtime propagation) from InboundService to ClientService. PeriodicTrafficResetJob now holds a clientService and calls j.clientService.ResetAllClientTraffics(&j.inboundService, id). The last client-mutation method on InboundService is gone. 2. Shorten redundantly-named routes/handlers under /panel/api/clients: - /clientIps/:email -> /ips/:email (handler getIps) - /clearClientIps/:email -> /clearIps/:email (handler clearIps) The "client" prefix was redundant inside the clients namespace. Frontend (InboundInfoModal) and api-docs updated to match. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds,clients): clean up inbound modal + enrich client modal Inbound modal rework (InboundFormModal.vue + inbound.js): - Drop the embedded Client subform in the Protocol tab. Multi-inbound clients are managed exclusively from the Clients page now; a fresh inbound is created with zero clients (settings constructors default to []) and the user attaches clients afterwards. - Hide the Protocol tab entirely when it has nothing to render (VMESS, Trojan without fallbacks, Hysteria). Auto-switches active tab to Basic when the tab disappears while focused. - Move the Security section (Security selector + TLS block with certs and ECH + Reality block) out of the Stream tab into its own Security tab, sharing the canEnableStream gate. Client modal additions (ClientFormModal.vue + ClientBulkAddModal.vue): - Flow select (xtls-rprx-vision / -udp443) appears only when the panel actually has a Vision-capable inbound (VLESS or PortFallback on TCP with TLS or Reality). Hidden otherwise, and cleared when it disappears. - IP Limit input is disabled when the panel-level ipLimitEnable setting is off, fetched into useClients alongside subSettings and threaded through ClientsPage to both modals. - Edit modal now shows an "IP Log" section listing IPs that have connected with the client's credentials, with refresh and clear buttons (calls the renamed /panel/api/clients/ips and /clearIps endpoints). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(inbounds): drop manual Fallbacks UI from inbound modal The PortFallback protocol type now covers the common VLESS-master-plus-children case with auto-wired dests, so the manual Fallbacks editor (showFallbacks block in the Protocol tab) is mostly redundant. Removed: - the v-if="showFallbacks" template block (SNI/ALPN/Path/dest/PROXY rows) - the showFallbacks computed - the addFallback / delFallback helpers - the .fallbacks-header / .fallbacks-title styles - the showFallbacks gate from hasProtocolTabContent (so Trojan-over-TCP no longer shows an empty Protocol tab) Power users who need a non-inbound fallback dest (nginx, static site) can still author settings.fallbacks via the Advanced JSON tab. * feat(clients,inbounds): move search/filter to Clients page + small fixes Search/filter relocation: - Remove the search/filter toolbar (search switch + filter radio + protocol/node selects + the visibleInbounds projection + inboundsFilterState localStorage + filter CSS + the SearchOutlined/ FilterOutlined/ObjectUtil/Inbound imports it required) from InboundList. The filters were all client-oriented buckets bolted onto the inbound row. - Add a search/filter toolbar to ClientsPage with the same shape: switch between deep-text search and bucket filter (active / deactive / depleted / expiring / online) + protocol filter that matches clients attached to at least one inbound with the chosen protocol. State persists in clientsFilterState localStorage. filteredClients drives both the desktop table and the mobile card list, and select-all / allSelected / someSelected only span the visible subset. - useClients now also fetches expireDiff and trafficDiff from /panel/setting/defaultSettings (used to detect the expiring bucket); ClientsPage threads them into the client-bucket helper. Loose fixes folded in: - Add Client: email field is auto-filled with a random handle on open, matching uuid/subId/password/auth. - Inbound clone: parse and reuse the source settings JSON (with clients reset to []) instead of building a fresh defaulted Settings, so VLESS Encryption/Decryption and other non-client fields survive the clone. - en-US.json: add the ipLog string used by the edit-client modal. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): add Reverse tag field for VLESS-attached clients Mirrors the Flow field's pattern: a Reverse tag input appears in the Add/Edit Client modal whenever at least one selected inbound is VLESS or PortFallback. The value rides over the wire as client.reverse = { tag: '...' } so it lands directly in model.Client's *ClientReverse field; an empty value omits the reverse key entirely. On edit the field is hydrated from props.client.reverse?.tag, and the showReverseTag watcher clears the field if the user drops the last VLESS-like inbound from the selection. * fix(xray): emit only protocol-relevant fields per client entry The Xray config synthesizer was writing every identifier field (id, password, flow, auth, security/method, reverse) on every client entry regardless of the inbound's protocol. Xray ignores unknown fields, so the config worked, but it diverged from the spec and leaked secrets across protocols when one client was attached to multiple inbounds — a VLESS inbound's generated config carried the same client's Trojan password and Hysteria auth alongside its uuid. Switch on inbound.Protocol when building each entry: - VLESS / PortFallback: id, flow, reverse - VMess: id, security - Trojan: password, flow - Shadowsocks: password, method - Hysteria / Hysteria2: auth email is emitted for every protocol. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): restore auto-disable kick under new schema disableInvalidClients still resolved (inbound_tag, email) pairs via JSON_EACH(inbounds.settings.clients), which is empty after migrating to the clients + client_inbounds tables. Result: xrayApi.RemoveUser never ran for depleted clients, clients.enable stayed true so the UI showed them as active, and only xray_client_traffic.enable got flipped - making "Restart Xray After Auto Disable" only half-work. Resolve the targets via a JOIN through the new schema, flip clients.enable so the Clients page reflects the state, and drop the legacy JSON write-back plus the subId cascade workaround (email is unique now). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): live WebSocket updates + Ended status surfacing ClientsPage now subscribes to traffic / client_stats / invalidate WebSocket events instead of polling /onlines every 10s. Per-row traffic counters refresh in place, online state stays current, and list-level mutations elsewhere trigger a refresh. The client roll-up summary moves from InboundsPage to ClientsPage where it belongs, restructured into six labeled stat tiles (Total / Online / Ended / Expiring / Disabled / Active) with email popovers on the ones with issues. Auto-disabled clients (traffic exhausted or expiry passed) now classify as 'depleted' even though clients.enable=false, so they show up under the Ended filter and render a red Ended tag instead of looking indistinguishable from an operator-disabled row. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(nodes): per-node client roll-up and panel version Added transient inboundCount / clientCount / onlineCount / depletedCount fields to model.Node, populated by NodeService.GetAll via aggregated queries (one join across inbounds + client_inbounds, one over client_traffics intersected with the in-memory online emails). The Nodes list renders these as colored chips on a new "Clients" column so an operator can see at a glance how many users each node carries and how many are currently online or depleted. Also exposes the remote panel's version. The central panel adds panelVersion to its /api/server/status payload (sourced from config.GetVersion). Probe reads that field and persists it on the node row, mirroring how xrayVersion already flows. NodesPage gets a new column next to Xray Version, in both desktop and mobile views, with English and Persian strings. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): stop node sync from resurrecting deleted clients Several related issues around node-managed clients: - Remote runtime: drop the per-inbound resetAllClientTraffics path and point traffic/onlines/lastOnline fetches at the new /panel/api/clients/* routes. - Delete from master: always push the updated inbound to the node even when the client was already disabled or depleted, so the node actually loses the user instead of silently keeping it. - setRemoteTraffic: mirror remote clients into the central tables only on first discovery of a node inbound. Matched inbounds let the master own the join table, so a stale snap can no longer re-create a ClientRecord (and join row) for a client that was just deleted on the master. - ClientService.Delete: route through submitTrafficWrite so deletes serialize with node traffic merges, and switch the final ClientRecord delete to an explicit Where("id = ?") clause. - setRemoteTraffic UNIQUE-constraint fix: use clause.OnConflict on inserts and email-keyed UPDATEs for client_traffics, so mirroring a snap doesn't trip the unique email index. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(clients): switch client API endpoints from id to email All client-scoped routes now use the unique email as the path key (get, update, del, attach, detach, links). Email is the stable, protocol-independent identifier — UUIDs don't exist for trojan or shadowsocks, and internal numeric ids leaked panel implementation detail into the public API. Removed the redundant /traffic/byId/:id endpoint (covered by /traffic/:email) and collapsed /links/:id/:email into /links/:email, which now returns links across every attached inbound for the client. Frontend selection, bulk delete, and toggle state are now keyed by email as well, dropping the id→email lookup workaround. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(server): move cached state and helpers into ServerService ServerController had grown to hold its own status cache, version-list TTL cache, history-bucket whitelist, and the loop that drove all three — concerns that belong in the service layer. Pull them out: - lastStatus + the @2s refresh become ServerService.RefreshStatus and ServerService.LastStatus; the controller's cron now just orchestrates the cross-service side effects (xrayMetrics sample, websocket broadcast). - The 15-minute Xray-versions cache (with stale-on-error fallback) moves into ServerService.GetXrayVersionsCached, collapsing the controller handler to a single call. - The freedom/blackhole outbound-tag walk used by /xraylogs becomes ServerService.GetDefaultLogOutboundTags. - The allowed-history-bucket whitelist moves to package-level service.IsAllowedHistoryBucket, so both NodeController and ServerController validate against the same list. Net result: web/controller/server.go drops from 458 to 365 lines and contains only HTTP wiring + presentation-y side effects. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * refactor(api): emit JSON-text columns as nested objects Inbound, ClientRecord, and InboundClientIps store settings / streamSettings / sniffing / reverse / ips as JSON-text in the DB. The API was passing that text through verbatim, so every consumer had to JSON.parse a string inside a string. Add MarshalJSON / UnmarshalJSON so the wire format is a real nested object, while still accepting the legacy escaped-string shape on write. Frontend dbinbound.js gets a matching coerceInboundJsonField helper for the same dual-shape read path, and inbound.js toJson stops emitting empty/placeholder fields (externalProxy [], sniffing destOverride when disabled, etc.) so the new normalised JSON stays terse. api-docs and the inbound-clone path are updated to the new shape. Controller route lists are regrouped so all GETs sit above POSTs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): include inboundIds and traffic in /clients/list ClientRecord got its own MarshalJSON in the previous commit, and ClientWithAttachments embeds it to add inboundIds and traffic. Go promotes the embedded MarshalJSON to the outer struct, so the encoder was calling ClientRecord.MarshalJSON for the whole value and silently dropping the extras. The frontend reads row.inboundIds / row.traffic from /clients/list, so attached inbounds didn't render and newly added clients looked like they hadn't saved. Add an explicit MarshalJSON on ClientWithAttachments that splices the extras in. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): gate IP Log on ipLimitEnable + clean access-log dropdown Legacy panel hid the IP Log section when access logging was off; the Vue 3 migration left it gated on isEdit only, so the section showed even when xray's access log was 'none' and nothing was being recorded. Restore the ipLimitEnable gate on the edit modal's IP Log form-item. While here, clean up the Xray Settings access-log dropdown: previously two 'none' entries appeared (an empty value labelled with t('none') and the literal 'none' from the options array). Drop the empty option for access log (the literal 'none' covers it) and relabel the empty option for error log / mask address to t('empty') so they're distinguishable. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(nodes): route per-client ops through node clients API + orphan sweep Adds Runtime methods AddClient, UpdateUser, and DeleteUser so master mutates clients on a node via /panel/api/clients/{add,update,del} rather than pushing the whole inbound. The previous rt.UpdateInbound path made the node DelInbound+AddInbound on every single-client change, briefly cycling every other user on the same inbound. DelInbound no longer filters by enable=true, so a disabled node inbound actually gets removed from the node instead of being resurrected by the next snap. setRemoteTrafficLocked now sweeps any ClientRecord with zero ClientInbound rows after SyncInbound rebuilds the attachments, which is how a node-side delete propagates back to master instead of leaving a detached ghost. ClientService.Delete tombstones the email first so a snap arriving mid-delete can't re-create the record. WebSocket broadcasts an "invalidate(clients)" message on every client mutation so the Clients page refreshes without manual reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(balancers): allow fallback on all strategies + feed burstObservatory from random/roundRobin Drops the random/roundRobin gate on the Fallback field in BalancerFormModal so every strategy can pick a fallback outbound. syncObservatories now feeds burstObservatory from leastLoad + random + roundRobin balancers (was leastLoad only), matching how leastPing feeds observatory. Fix the JsonEditor "Unexpected end of JSON input" that appeared when switching a balancer between leastPing and another strategy: the obsView watcher was gated on showObsEditor (a boolean OR of the two flags) and missed the case where one observatory swapped for the other in the same tick. Watch the individual flags instead so obsView flips to the surviving editor and the getter stops pointing at a deleted key. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): use sortedInbounds for mobile empty-state check InboundList referenced an undefined visibleInbounds in the mobile card list's empty-state guard, throwing "Cannot read properties of undefined (reading 'length')" and breaking the entire mobile render. * feat(clients): sortable table columns Adds the same sortState / sortableCol / sortFns pattern InboundList uses, wrapping filteredClients in sortedClients so sort composes with the existing search/filter pipeline. Sortable: enable, email, inboundIds (attachment count), traffic, remaining, expiryTime; actions and online stay unsorted. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(shadowsocks): generate valid ss2022 keys and per-client method for legacy ciphers The Add Client flow on shadowsocks inbounds was producing xray configs that failed to start: - 2022-blake3-* ciphers need a base64-encoded key of an exact byte length per cipher. fillProtocolDefaults was assigning a uuid-style string, which xray rejects as "bad key". Now the password is generated (or replaced if invalid) via random.Base64Bytes(n) sized to the chosen cipher. - Legacy ciphers (aes-256-gcm, chacha20-*, xchacha20-*) require a per-client method field in multi-user mode; model.Client has no Method, so settings.clients was stored without one and xray failed with "unsupported cipher method:". applyShadowsocksClientMethod now injects the top-level method into each client on add/update, and healShadowsocksClientMethods backfills it at xray-config-build time so existing inbounds heal on the next start. - xray/api.go ssCipherType switch was missing aes-256-gcm, which fell through to ss2022 path. - SSMethods dropdown now offers aes-256-gcm. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): preserve ClientRecord on inbound delete + filter Attached inbounds to multi-client protocols Replace the global orphan sweep in setRemoteTrafficLocked with a per-inbound diff cleanup: only delete a ClientRecord whose email disappeared from a snap-tracked inbound (i.e. a node-side delete). Inbounds that vanished entirely from the snap (e.g. admin deleted the inbound on master) aren't iterated, so a client whose last attachment came from that inbound is now left alone instead of being deleted alongside the inbound. ClientFormModal and ClientBulkAddModal now filter the Attached inbounds dropdown to protocols that actually support multiple clients: shadowsocks, vless, vmess, trojan, hysteria, hysteria2, and portfallback (which routes through VLESS settings). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): make empty-state text readable on dark/ultra themes The "No clients yet" empty state had a hardcoded black color (rgba(0,0,0,0.45)) that vanished against the dark backgrounds. Drop the inline color, let it inherit from the AntD theme, and fade with opacity like the mobile card empty state already does. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(clients): client-first tgbot add flow, tgId field, lightweight inbound options - tgbot: drop legacy per-protocol Add Client UI in favour of a client-first multi-inbound flow. New BuildClientDraftMessage / getInboundsAttachPicker let an admin pick one or more inbounds and submit a single client; per- protocol secrets are now generated server-side via fillProtocolDefaults. Drops awaiting_id/awaiting_password_tr/awaiting_password_sh state cases and add_client_ch_default_id/pass_tr/pass_sh/flow callbacks. Adds a setTGUser button + awaiting_tg_id state so the bot can set Client.TgID during Add. - clients UI: add Telegram user ID input to ClientFormModal (0 = none). Hide IP Limit field entirely when ipLimitEnable is off — disabled fields still take layout space, this collapses Auth(Hysteria) to full width. - inbounds API: new GET /panel/api/inbounds/options that returns just {id, remark, protocol, port, tlsFlowCapable}. Used by the clients page pickers so the dropdown payload stays small on panels with thousands of clients (drops settings JSON, clientStats, streamSettings). Server-side TlsFlowCapable mirrors Inbound.canEnableTlsFlow so the modal no longer needs to parse streamSettings client-side. - clientInfoMsg now shows attached inbound remarks, and getInboundUsages reports the attached client count per inbound. - api-docs: document the new /options endpoint and add tgId / flow to the clients add/update bodies. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(inbounds): keep Node column visible for node-attached inbounds The Node column was bound to hasActiveNode, so disabling every node hid the column even when inbounds were still attached to those nodes — the admin lost the visual cue that those inbounds belonged to a node and would come back when it was re-enabled. Combine hasActiveNode with a new hasNodeAttachedInbound check (any dbInbound with nodeId != null) so the column survives node-disable. * fix(api-docs): accept functional-component icons in EndpointSection AntD-Vue icons (SafetyCertificateOutlined, etc.) are functional components, so the icon prop's type: Object validator was rejecting them with a "Expected Object, got Function" warning at runtime. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * test: cover crypto, random, netsafe, sub helpers, xray equals, websocket hub, node service Adds ~110 unit tests across previously untested packages. Focus on pure-logic and concurrency surfaces where regressions would silently affect users: - util/crypto, util/random: password hashing round-trip, ss2022 key generation, alphabet/length invariants. - util/netsafe: IsBlockedIP edge cases, NormalizeHost validation, SSRF guard with AllowPrivate context bypass. - util/common, util/json_util: traffic formatter, Combine nil-skip, RawMessage empty-as-null and copy-on-unmarshal. - sub: splitLinkLines, searchKey/searchHost, kcp share fields, finalmask normalization, buildVmessLink round-trip. - xray: Config.Equals and InboundConfig.Equals field-by-field, getRequiredUserString/getOptionalUserString type checks. - web/websocket: hub registration, throttling, slow-client eviction, nil-receiver safety, concurrent register/unregister. - web/service: NodeService.normalize validation, normalizeBasePath, HeartbeatPatch.ToUI mapping. - web/job: atomicBool concurrent set/takeAndReset semantics. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n(clients): replace English fallbacks with proper translation keys Pulls every hard-coded English label/title in the Clients page and its four modals through the i18n layer so localized panels stop leaking English. New keys live under pages.clients (auth, hysteriaAuth, uuid, flow, flowNone, reverseTag, reverseTagPlaceholder, telegramId, telegramIdPlaceholder, created, updated, ipLimit) plus refresh at the root and toasts.bulkDeletedMixed / bulkCreatedMixed for partial-failure toasts. Also switches the add-client modal's primary button from "Add" to "Create" for consistency with other create flows. The bulk-add Random/Random+Prefix/... email-method options stay hard-coded by request - they're identifier-shaped strings. * i18n: backfill 99 missing keys across all 12 non-English locales Brings every translation file up to parity with en-US.json so the Clients page, the fallback-children inbound section, the new refresh verb, the Nodes panel-version label and a handful of older holes stop falling through to the English fallback. New strings span: - pages.clients.* (labels, confirmations, toasts, emailMethods) - pages.inbounds.portFallback.* (Reality fallback inbound section) - pages.nodes.panelVersion, menu.clients, refresh Technical identifiers (Auth, UUID, Flow, Reverse tag) are intentionally left untranslated since they correspond to xray-core field names. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * i18n: drop stale pages.client block duplicated in every non-English locale Every non-English locale carried a pages.client (singular) section with 30 entries that duplicated pages.clients (plural). The plural namespace is what the Vue code actually consumes; the singular one was dead weight from an older rename that never got cleaned up in the non-English files. Removing it brings every locale to exactly 984 keys, matching en-US.json. * chore: apply modernize analyzer fixes across codebase Mechanical replacements suggested by golang.org/x/tools/.../modernize: strings.Cut/CutPrefix/SplitSeq, slices.Contains, maps.Copy, min(), range-over-int, new(expr), strings.Builder for hot += loops, reflect.TypeFor[T](), sync.WaitGroup.Go(), drop legacy //+build lines. * feat(database): add PostgreSQL as an optional backend alongside SQLite Lets operators with large client counts or multi-node setups pick PostgreSQL at install time without breaking the existing SQLite default. Backend is selected at runtime via XUI_DB_TYPE/XUI_DB_DSN, a small dialect layer keeps the five JSON_EXTRACT/JSON_EACH queries portable, and a new `x-ui migrate-db` subcommand copies SQLite data into PostgreSQL in FK-aware order. * fix(inbounds): gate node selector to multi-node-capable protocols Hide the Deploy-To selector and clear nodeId when switching to a protocol that can't run on a remote node. Also: - subs: return 404 (not 400) when subId matches no inbounds, so VPN clients distinguish "deleted/unknown" from a server error - hysteria link gen: use the inbound's resolved address so node-managed inbounds advertise the node host instead of the central panel - shadowsocks: default network to 'tcp' (udp was causing issues for some clients on first-create) - vite dev proxy: rewrite migrated-route bypass against the live base path instead of a hardcoded single-segment regex Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(clients): bulk add/delete correctness + perf, working pagination, delayed-start in form Bulk add/delete were serial on the frontend (one toast per call, N round-trips) and the backend race exposed by parallelizing them lost client attachments and hit UNIQUE constraint failed on client_inbounds. The single add/edit modal also had no Start-After-First-Use option, and the table never showed the delayed duration. Backend (web/service/client.go): - Per-inbound mutex on Add/Update/Del InboundClient so concurrent writers on the same inbound don't lose the read-modify-write of settings JSON. - SyncInbound skips create+join when the email is tombstoned so a concurrent maintenance pass (adjustTraffics, autoRenewClients, markClientsDisabledIn- Settings) that did a stale RMW can't resurrect a just-deleted client with a fresh id. - compactOrphans sweeps settings.clients entries whose ClientRecord no longer exists, applied in Add/DelInboundClient + DelInboundClientByEmail so each user-initiated mutation self-heals the inbound's settings. - DelInboundClient uses Pluck instead of First for the stats lookup so a missing row doesn't abort the delete with a noisy ErrRecordNotFound log. Frontend: - HttpUtil.{get,post} accept a silent option that suppresses the auto-toast. - ClientBulkAddModal fires creates in parallel + silent + one summary toast. - useClients.removeMany runs deletes in parallel + silent and refreshes once; ClientsPage bulk delete uses it and shows one aggregate toast. - useClients.applyInvalidate debounces 200 ms so the burst of N WebSocket invalidate events from the backend collapses into a single refresh. - ClientsPage pagination is reactive (paginationState ref + tablePagination computed); onTableChange persists page-size and page changes. - ClientFormModal gains a Start-After-First-Use switch + Duration days input alongside the existing Expiry Date picker; on edit-mode open a negative expiryTime is decoded back to delayed mode + days; on submit the payload sends -86400000 * days or the absolute timestamp. - ClientsPage table shows the delayed-start duration (blue tag Nd, tooltip Start After First Use: Nd) instead of infinity. - Telegram ID field in the form is hidden when /panel/setting/defaultSettings reports tgBotEnable=false; Comment then fills the row. - Form row 3 collapses UUID (span 12) + Total GB (span 8) + Limit IP (span 4) when ipLimitEnable is on, else UUID + Total GB at 12/12. - useInbounds.rollupClients counts only clients with a matching clientStats row, so orphans in settings.clients no longer inflate the inbound's count. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(windows): clean shutdown, working panel restart, harden kernel32 load Three Windows-specific issues addressed: 1. Orphaned xray-windows-amd64 after VS Code debugger stop. Delve's "Stop" sends TerminateProcess to the Go binary, which is uncatchable — our signal handlers never run, so xrayService.StopXray() is skipped and xray is left dangling. Spawn xray as a child of a Job Object with JOB_OBJECT_LIMIT_KILL_ON_JOB_CLOSE so the OS kills xray when our handle to the job is closed (which happens even on TerminateProcess). Also trap os.Interrupt in main so Ctrl+C in the terminal runs the graceful path. 2. /panel/setting/restartPanel logged "failed to send SIGHUP signal: not supported by windows" because Windows can't deliver arbitrary signals. Add a restart hook in web/global; main registers it to push SIGHUP into its own signal channel, and RestartPanel calls the hook before falling back to the (Unix-only) signal path. Same restart-loop code runs in both cases. 3. util/sys/sys_windows.go now uses windows.NewLazySystemDLL so the kernel32.dll resolve is pinned to %SystemRoot%\System32 (prevents DLL hijacking by a planted DLL next to the binary). Local filetime type replaced with windows.Filetime, and the unreliable syscall.GetLastError() fallback replaced with a type assertion on the errno captured at call time. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(sys): correct CPU/connection accounting on linux + darwin util/sys/sys_linux.go: - GetTCPCount/GetUDPCount were counting the column header row in /proc/net/{tcp,udp}[6] as a connection, inflating the reported total by 1 per non-empty file (so the panel status line always showed 2 more connections than actually existed). Replace getLinesNum + safeGetLinesNum with a single bufio.Scanner-based countConnections that skips the header. - CPUPercentRaw now opens HostProc("stat") instead of a hardcoded /proc/stat so HOST_PROC overrides apply, matching the connection counters in the same file. - Simplify CPU field unpacking: pad nums to 8 once instead of guarding every assignment with a len check. util/sys/sys_darwin.go: - Fix swapped idle/intr indices on kern.cp_time. BSD CPUSTATES order is user, nice, sys, intr, idle (CP_INTR=3, CP_IDLE=4) — gopsutil's cpu_darwin_nocgo.go reads the same layout. The previous code used out[3] as idle and out[4] as intr, so busy = total - dIdle was actually subtracting interrupt time, making the panel report CPU usage close to 100% on macOS regardless of actual load. - Collapse the per-field delta math into a single loop. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(xray): rotate crash reports into log folder, prevent overwrites writeCrashReport had two flaws: it wrote to the bin folder (alongside the xray binary) which conflates artifacts, and the second-precision timestamp meant a tight restart-loop crash burst overwrote prior reports. Write to the log folder with nanosecond precision and keep the last 10 reports. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * revert(inbounds): drop unreleased portfallback protocol The Port-with-Fallback inbound (commit 62fd9f9d) was confusing as a standalone protocol — fallbacks belong on a regular VLESS/Trojan TCP-TLS inbound, the way Xray models them natively. Rip out the entire feature cleanly (no migration needed since it was never released): protocol constant, fallback children DB table, FallbackService, 2 API endpoints, all UI rows, related translations and api-docs. A native fallback flow attached to VLESS/Trojan TCP-TLS/Reality will land in a follow-up commit. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(inbounds): native fallbacks on VLESS/Trojan TCP-TLS, with working child links A VLESS or Trojan inbound on TCP with TLS or Reality can now act as a fallback master: pick existing inbounds as children and the panel auto- fills the SNI / ALPN / path / xver routing fields from each child's transport, auto-builds settings.fallbacks at config-gen time, and rewrites the child's client-share link so it advertises the master's reachable endpoint and TLS state instead of the child's loopback listen. Layout matches the Xray All-in-One Nginx example: master at :443 with clients + TLS, each child on 127.0.0.1 with its own transport+clients. Order matters (Xray walks fallbacks top-to-bottom) — reorder via the per-row up/down arrows. Path / SNI / ALPN are exposed under a per-row Edit toggle for the rare cases where the auto-derivation needs overriding; otherwise just pick a child and you're done. Backend: new InboundFallback table + FallbackService (GetByMaster / SetByMaster / GetParentForChild / BuildFallbacksJSON); two routes (GET / POST /panel/api/inbounds/:id/fallbacks); xray.GetXrayConfig injects settings.fallbacks for any VLESS/Trojan TCP-TLS/Reality inbound; GetInbounds annotates each child with FallbackParent so the frontend can rewrite links without an extra round-trip. Link projection covers every emission path — clients-page QR/links, per-inbound Get URL, raw subscription, sub-JSON, sub-Clash, and the inbounds-page link/info/QR — via a shared projectThroughFallbackMaster on the backend and a shared projectChildThroughMaster on the frontend that both handle the panel-tracked relationship and the legacy unix-socket (@vless-ws) convention. Strings translated into all 12 non-English locales. * docs: rewrite CONTRIBUTING with full local-dev setup The prior three-line CONTRIBUTING left newcomers guessing at every non-trivial step: which Go / Node versions, where xray comes from, why the panel goes blank when XUI_DEBUG=true is flipped on, how the Vue multi-page setup is wired, what to do on Windows when go build trips on the CGo SQLite driver. Now covers prerequisites, MinGW-w64 install on Windows (niXman builds or MSYS2), one-shot first-time setup, two frontend dev workflows with the XUI_DEBUG asset-cache gotcha called out, the architecture and conventions of the Vue side, a project-layout map, useful env vars, and the PR checklist. ---------
2026-05-19 10:16:42 +00:00
}
Reference in a new issue Copy permalink