{"owner":"CareyWang","repo":"sub-web","hasSkills":true,"hasMcp":false,"mcpConfig":null,"found":["AGENTS.md"],"skills":{"AGENTS.md":"# AGENTS GUIDE\n\nVue 3 + Vite 8 SPA with Element Plus. Keep changes small, follow existing patterns, avoid refactors during fixes.\n\n## Quick Facts\n\n- Framework: Vue 3 (Options API)\n- Build tool: Vite 8\n- UI: Element Plus 2 (icons via `@element-plus/icons-vue`)\n- Router: Vue Router 4 (`createWebHistory`, base from `import.meta.env.BASE_URL`)\n- Node: 24.x\n- No automated tests currently\n\n## Commands\n\n| Command | Description |\n|---------|-------------|\n| `yarn install` | Install dependencies |\n| `yarn dev` | Start dev server (host: 0.0.0.0) |\n| `yarn build` | Production build |\n| `yarn preview` | Preview production build locally |\n| `yarn lint` | ESLint check |\n\n## CI / Workflows\n\n- **build.yml**: triggers on push/PR to `master` and `dev` — runs `yarn install --frozen-lockfile` + `yarn lint` + `yarn build`, then uploads `dist/` as artifact (7-day retention)\n- **docker-build-push.yml**: triggers on push to `master` — builds and pushes multi-arch image (`linux/amd64`, `linux/arm64`) to `careywong/subweb:latest`\n\n## Repository Layout\n\n```\nsrc/\n├── main.js                      # App bootstrap, plugin registration, Vue mount\n├── App.vue\n├── router/index.js              # Vue Router (history mode)\n├── views/Subconverter.vue       # Main page\n├── components/\n│   ├── ConfigUploadDialog.vue   # Config upload dialog\n│   ├── UrlParseDialog.vue       # URL parse dialog\n│   └── SvgIcon/index.vue        # SVG icon wrapper component\n├── composables/\n│   ├── useSubscription.js       # URL building logic (makeUrl, buildBaseUrl, buildAdvancedParams)\n│   ├── useSubscriptionForm.js   # Reactive form state + addCustomParam + saveSubUrl\n│   └── useUrlParser.js          # Short-link expansion + URL-to-form parser (analyzeUrl, parseUrl)\n├── services/\n│   ├── backendService.js        # BackendService.getBackendVersion()\n│   ├── shortUrlService.js       # ShortUrlService.generateShortUrl()\n│   └── configUploadService.js   # ConfigUploadService.uploadConfig(), handleUploadSuccess()\n├── config/\n│   ├── constants.js             # CONSTANTS (env-backed, DEFAULT_CLIENT_TYPE='clash')\n│   ├── client-types.js          # CLIENT_TYPES map (display label → target value)\n│   └── remote-configs.js        # REMOTE_CONFIGS grouped options array\n├── utils/\n│   ├── storage.js               # getLocalStorageItem / setLocalStorageItem (TTL-based)\n│   ├── validators.js            # validateSubUrl → { valid, message } | validateForm → boolean\n│   ├── formatters.js            # formatVersion, formatErrorMessage, processSubUrl\n│   ├── clipboard.js             # copyText (Clipboard API + execCommand fallback)\n│   └── search.js                # Backend autocomplete search helper\n├── plugins/                     # setupXxx(app) registrations (element-plus, axios, device)\n└── icons/\n    ├── index.js                 # Registers SVG sprite\n    └── svg/                     # SVG source files (e.g., github.svg)\nservices/                        # Docker Compose stack (subweb + myurls + redis)\n```\n\n## Key Modules\n\n### `src/config/constants.js`\nAll values read from `import.meta.env` with `VITE_` prefix. Key constants:\n- `DEFAULT_BACKEND` — appends `/sub?` to `VITE_SUBCONVERTER_DEFAULT_BACKEND`\n- `DEFAULT_CLIENT_TYPE` — hardcoded `'clash'`\n- `SHORT_URL_API`, `CONFIG_UPLOAD_API`, `PROJECT`, `BOT_LINK`, etc.\n\n### `src/composables/useSubscriptionForm.js`\nReturns plain object merged into `data()` via spread. Form fields include: `sourceSubUrl`, `clientType`, `customBackend`, `remoteConfig`, `emoji`, `nodeList`, `sort`, `udp`, `tfo`, `scv`, `fdn`, `expand`, `appendType`, `insert`, `new_name`, `tpl.surge.doh`, `tpl.clash.doh`. Default mode is advanced (`advanced: \"2\"`).\n\n### `src/composables/useSubscription.js`\n`makeUrl(form, advanced, processedSubUrl, currentBackend, customParams, needUdp)` — returns empty string on validation failure, otherwise builds full query string. Advanced mode adds remote config, include/exclude, filename, UDP, template, and custom params.\n\n### `src/composables/useUrlParser.js`\n`analyzeUrl(url)` — if URL contains `\"target\"`, returns as-is; otherwise fetches and returns `response.url` (short-link expansion, requires CORS on short-link service).  \n`parseUrl(url, form, customParams, onSuccess, onError)` — parses all query params back into form fields; unknown params become `customParams` entries.\n\n### `src/services/`\nAll service classes are static methods. They take `$axios` as first argument (injected via plugin). Silent failures are acceptable for `getBackendVersion`. Upload response shape: `{ code: 0, data: { url }, msg }`. Short URL response shape: `{ Code: 1, ShortUrl, Message }`.\n\n### `src/utils/storage.js`\nTTL stored inside the JSON value as `{ setTime, ttl, expire, value }`. `expire` checked on every read; expired entries are removed automatically. TTL value comes from `VITE_CACHE_TTL` env var.\n\n## Code Style\n\n- Indentation: 2 spaces\n- Quotes: single quotes preferred\n- Semicolons: none (`semi: 0`)\n- Vue component names: single-word allowed (`vue/multi-word-component-names: off`)\n- `no-console` / `no-debugger`: error in production, off in dev\n- ESLint extends: `plugin:vue/vue3-essential`, `eslint:recommended`\n- Parser: `@babel/eslint-parser` with `requireConfigFile: false`\n\n## Imports & Modules\n\n- ES modules (`import`/`export`) throughout\n- Absolute alias `@` maps to `src/` (see `vite.config.js`)\n- Import order: core libs → local config/utils → services → components\n- Dynamic imports only for route lazy-load\n\n## Vue Patterns\n\n- Options API everywhere; do not introduce Composition API or `<script setup>`\n- Component structure: `<template>`, `<script>`, `<style>`\n- Reactive state in `data()`; derived state in `computed`\n- Composables spread via `...useSubscription()` / `...useUrlParser()` in `methods`\n- `useSubscriptionForm()` spread via `...subscriptionForm` in `data()`\n- Globals registered on `app.config.globalProperties` (`$axios`, `$getOS`, `$message`, `$notify`)\n- Named slots only (`<template #header>`); `slot=\"x\"` and `$listeners` do not exist in Vue 3\n- Element Plus icon components exposed via `computed` (not `data`) to avoid reactive wrapping\n\n## Icons\n\n- SVG sprites via `vite-plugin-svg-icons`; icon dirs: `src/icons/svg`\n- Usage: `<svg-icon icon-class=\"name\" />`\n- Symbol ID format: `icon-[name]`\n- UI icons come from `@element-plus/icons-vue` as components; there are no `el-icon-*` font classes\n\n## Environment Variables\n\n- All env vars use `VITE_` prefix; access via `import.meta.env`\n- Do not commit `.env.local`, `.env.*.local`\n- Constants centralised in `src/config/constants.js` — do not scatter `import.meta.env` calls\n\n## Validation\n\n- Use `src/utils/validators.js` for user-facing checks\n- `validateSubUrl` returns `{ valid, message }`; `validateForm` returns boolean\n- Do not throw for validation flow\n\n## Error Handling\n\n- UI errors via `this.$message.*` or `this.$notify`\n- Silent failures acceptable only when UX demands it (e.g., backend version fetch)\n- Use `formatErrorMessage` from `src/utils/formatters.js` for consistent error strings\n\n## Docker\n\n- Base images: `node:24-alpine` (build), `nginx:1.24-alpine` (runtime)\n- Build: `yarn install && yarn build`, output copied to `/usr/share/nginx/html`\n- Services compose stack in `services/` includes myurls + Redis\n\n## Git Hygiene\n\n- Do not commit `dist/`, `node_modules/`, `.env.local`, `.env.*.local`\n- Avoid adding generated files\n\n## Frontend Safety\n\n- Avoid inline styles unless already present in nearby code\n- Prefer Element Plus components and existing patterns\n- Keep UI message strings consistent (mostly Chinese)\n- `.el-form-item__content` and `el-row` are flex containers in Element Plus; use `justify-content` / explicit widths rather than `text-align` to position controls\n\n## Performance\n\n- Do not introduce heavy dependencies; prefer existing utilities\n- Keep all network calls in `src/services/`\n\n## Example Patterns\n\n```js\n// Route lazy-load\ncomponent: () => import('../views/Subconverter.vue')\n\n// Plugin registration\nexport function setupAxios(app) {\n  app.config.globalProperties.$axios = axios\n}\n\n// Service class\nexport class BackendService {\n  static async getBackendVersion($axios) { ... }\n}\n\n// Composable (Options API style)\nexport function useSubscription() {\n  return { makeUrl, buildBaseUrl, buildAdvancedParams }\n}\n\n// Spread composable into methods\nmethods: {\n  ...useSubscription(),\n  ...useUrlParser()\n}\n\n// Spread form state into data()\ndata() {\n  return { ...useSubscriptionForm(), otherField: '' }\n}\n```\n\n## Suggested Manual Checks\n\n- `yarn lint`\n- `yarn build`\n- Run `yarn dev` and smoke the main screen\n\n## Notes for Agents\n\n- Follow existing patterns; minimise scope\n- No large refactors unless explicitly requested\n- Do not introduce TypeScript or new tooling without approval\n- No test runner configured; if added, document the single-test command here\n"},"files":{"AGENTS.md":"# AGENTS GUIDE\n\nVue 3 + Vite 8 SPA with Element Plus. Keep changes small, follow existing patterns, avoid refactors during fixes.\n\n## Quick Facts\n\n- Framework: Vue 3 (Options API)\n- Build tool: Vite 8\n- UI: Element Plus 2 (icons via `@element-plus/icons-vue`)\n- Router: Vue Router 4 (`createWebHistory`, base from `import.meta.env.BASE_URL`)\n- Node: 24.x\n- No automated tests currently\n\n## Commands\n\n| Command | Description |\n|---------|-------------|\n| `yarn install` | Install dependencies |\n| `yarn dev` | Start dev server (host: 0.0.0.0) |\n| `yarn build` | Production build |\n| `yarn preview` | Preview production build locally |\n| `yarn lint` | ESLint check |\n\n## CI / Workflows\n\n- **build.yml**: triggers on push/PR to `master` and `dev` — runs `yarn install --frozen-lockfile` + `yarn lint` + `yarn build`, then uploads `dist/` as artifact (7-day retention)\n- **docker-build-push.yml**: triggers on push to `master` — builds and pushes multi-arch image (`linux/amd64`, `linux/arm64`) to `careywong/subweb:latest`\n\n## Repository Layout\n\n```\nsrc/\n├── main.js                      # App bootstrap, plugin registration, Vue mount\n├── App.vue\n├── router/index.js              # Vue Router (history mode)\n├── views/Subconverter.vue       # Main page\n├── components/\n│   ├── ConfigUploadDialog.vue   # Config upload dialog\n│   ├── UrlParseDialog.vue       # URL parse dialog\n│   └── SvgIcon/index.vue        # SVG icon wrapper component\n├── composables/\n│   ├── useSubscription.js       # URL building logic (makeUrl, buildBaseUrl, buildAdvancedParams)\n│   ├── useSubscriptionForm.js   # Reactive form state + addCustomParam + saveSubUrl\n│   └── useUrlParser.js          # Short-link expansion + URL-to-form parser (analyzeUrl, parseUrl)\n├── services/\n│   ├── backendService.js        # BackendService.getBackendVersion()\n│   ├── shortUrlService.js       # ShortUrlService.generateShortUrl()\n│   └── configUploadService.js   # ConfigUploadService.uploadConfig(), handleUploadSuccess()\n├── config/\n│   ├── constants.js             # CONSTANTS (env-backed, DEFAULT_CLIENT_TYPE='clash')\n│   ├── client-types.js          # CLIENT_TYPES map (display label → target value)\n│   └── remote-configs.js        # REMOTE_CONFIGS grouped options array\n├── utils/\n│   ├── storage.js               # getLocalStorageItem / setLocalStorageItem (TTL-based)\n│   ├── validators.js            # validateSubUrl → { valid, message } | validateForm → boolean\n│   ├── formatters.js            # formatVersion, formatErrorMessage, processSubUrl\n│   ├── clipboard.js             # copyText (Clipboard API + execCommand fallback)\n│   └── search.js                # Backend autocomplete search helper\n├── plugins/                     # setupXxx(app) registrations (element-plus, axios, device)\n└── icons/\n    ├── index.js                 # Registers SVG sprite\n    └── svg/                     # SVG source files (e.g., github.svg)\nservices/                        # Docker Compose stack (subweb + myurls + redis)\n```\n\n## Key Modules\n\n### `src/config/constants.js`\nAll values read from `import.meta.env` with `VITE_` prefix. Key constants:\n- `DEFAULT_BACKEND` — appends `/sub?` to `VITE_SUBCONVERTER_DEFAULT_BACKEND`\n- `DEFAULT_CLIENT_TYPE` — hardcoded `'clash'`\n- `SHORT_URL_API`, `CONFIG_UPLOAD_API`, `PROJECT`, `BOT_LINK`, etc.\n\n### `src/composables/useSubscriptionForm.js`\nReturns plain object merged into `data()` via spread. Form fields include: `sourceSubUrl`, `clientType`, `customBackend`, `remoteConfig`, `emoji`, `nodeList`, `sort`, `udp`, `tfo`, `scv`, `fdn`, `expand`, `appendType`, `insert`, `new_name`, `tpl.surge.doh`, `tpl.clash.doh`. Default mode is advanced (`advanced: \"2\"`).\n\n### `src/composables/useSubscription.js`\n`makeUrl(form, advanced, processedSubUrl, currentBackend, customParams, needUdp)` — returns empty string on validation failure, otherwise builds full query string. Advanced mode adds remote config, include/exclude, filename, UDP, template, and custom params.\n\n### `src/composables/useUrlParser.js`\n`analyzeUrl(url)` — if URL contains `\"target\"`, returns as-is; otherwise fetches and returns `response.url` (short-link expansion, requires CORS on short-link service).  \n`parseUrl(url, form, customParams, onSuccess, onError)` — parses all query params back into form fields; unknown params become `customParams` entries.\n\n### `src/services/`\nAll service classes are static methods. They take `$axios` as first argument (injected via plugin). Silent failures are acceptable for `getBackendVersion`. Upload response shape: `{ code: 0, data: { url }, msg }`. Short URL response shape: `{ Code: 1, ShortUrl, Message }`.\n\n### `src/utils/storage.js`\nTTL stored inside the JSON value as `{ setTime, ttl, expire, value }`. `expire` checked on every read; expired entries are removed automatically. TTL value comes from `VITE_CACHE_TTL` env var.\n\n## Code Style\n\n- Indentation: 2 spaces\n- Quotes: single quotes preferred\n- Semicolons: none (`semi: 0`)\n- Vue component names: single-word allowed (`vue/multi-word-component-names: off`)\n- `no-console` / `no-debugger`: error in production, off in dev\n- ESLint extends: `plugin:vue/vue3-essential`, `eslint:recommended`\n- Parser: `@babel/eslint-parser` with `requireConfigFile: false`\n\n## Imports & Modules\n\n- ES modules (`import`/`export`) throughout\n- Absolute alias `@` maps to `src/` (see `vite.config.js`)\n- Import order: core libs → local config/utils → services → components\n- Dynamic imports only for route lazy-load\n\n## Vue Patterns\n\n- Options API everywhere; do not introduce Composition API or `<script setup>`\n- Component structure: `<template>`, `<script>`, `<style>`\n- Reactive state in `data()`; derived state in `computed`\n- Composables spread via `...useSubscription()` / `...useUrlParser()` in `methods`\n- `useSubscriptionForm()` spread via `...subscriptionForm` in `data()`\n- Globals registered on `app.config.globalProperties` (`$axios`, `$getOS`, `$message`, `$notify`)\n- Named slots only (`<template #header>`); `slot=\"x\"` and `$listeners` do not exist in Vue 3\n- Element Plus icon components exposed via `computed` (not `data`) to avoid reactive wrapping\n\n## Icons\n\n- SVG sprites via `vite-plugin-svg-icons`; icon dirs: `src/icons/svg`\n- Usage: `<svg-icon icon-class=\"name\" />`\n- Symbol ID format: `icon-[name]`\n- UI icons come from `@element-plus/icons-vue` as components; there are no `el-icon-*` font classes\n\n## Environment Variables\n\n- All env vars use `VITE_` prefix; access via `import.meta.env`\n- Do not commit `.env.local`, `.env.*.local`\n- Constants centralised in `src/config/constants.js` — do not scatter `import.meta.env` calls\n\n## Validation\n\n- Use `src/utils/validators.js` for user-facing checks\n- `validateSubUrl` returns `{ valid, message }`; `validateForm` returns boolean\n- Do not throw for validation flow\n\n## Error Handling\n\n- UI errors via `this.$message.*` or `this.$notify`\n- Silent failures acceptable only when UX demands it (e.g., backend version fetch)\n- Use `formatErrorMessage` from `src/utils/formatters.js` for consistent error strings\n\n## Docker\n\n- Base images: `node:24-alpine` (build), `nginx:1.24-alpine` (runtime)\n- Build: `yarn install && yarn build`, output copied to `/usr/share/nginx/html`\n- Services compose stack in `services/` includes myurls + Redis\n\n## Git Hygiene\n\n- Do not commit `dist/`, `node_modules/`, `.env.local`, `.env.*.local`\n- Avoid adding generated files\n\n## Frontend Safety\n\n- Avoid inline styles unless already present in nearby code\n- Prefer Element Plus components and existing patterns\n- Keep UI message strings consistent (mostly Chinese)\n- `.el-form-item__content` and `el-row` are flex containers in Element Plus; use `justify-content` / explicit widths rather than `text-align` to position controls\n\n## Performance\n\n- Do not introduce heavy dependencies; prefer existing utilities\n- Keep all network calls in `src/services/`\n\n## Example Patterns\n\n```js\n// Route lazy-load\ncomponent: () => import('../views/Subconverter.vue')\n\n// Plugin registration\nexport function setupAxios(app) {\n  app.config.globalProperties.$axios = axios\n}\n\n// Service class\nexport class BackendService {\n  static async getBackendVersion($axios) { ... }\n}\n\n// Composable (Options API style)\nexport function useSubscription() {\n  return { makeUrl, buildBaseUrl, buildAdvancedParams }\n}\n\n// Spread composable into methods\nmethods: {\n  ...useSubscription(),\n  ...useUrlParser()\n}\n\n// Spread form state into data()\ndata() {\n  return { ...useSubscriptionForm(), otherField: '' }\n}\n```\n\n## Suggested Manual Checks\n\n- `yarn lint`\n- `yarn build`\n- Run `yarn dev` and smoke the main screen\n\n## Notes for Agents\n\n- Follow existing patterns; minimise scope\n- No large refactors unless explicitly requested\n- Do not introduce TypeScript or new tooling without approval\n- No test runner configured; if added, document the single-test command here\n"},"items":[{"name":"AGENTS.md","path":"AGENTS.md","title":"AGENTS.md","content":"# AGENTS GUIDE\n\nVue 3 + Vite 8 SPA with Element Plus. Keep changes small, follow existing patterns, avoid refactors during fixes.\n\n## Quick Facts\n\n- Framework: Vue 3 (Options API)\n- Build tool: Vite 8\n- UI: Element Plus 2 (icons via `@element-plus/icons-vue`)\n- Router: Vue Router 4 (`createWebHistory`, base from `import.meta.env.BASE_URL`)\n- Node: 24.x\n- No automated tests currently\n\n## Commands\n\n| Command | Description |\n|---------|-------------|\n| `yarn install` | Install dependencies |\n| `yarn dev` | Start dev server (host: 0.0.0.0) |\n| `yarn build` | Production build |\n| `yarn preview` | Preview production build locally |\n| `yarn lint` | ESLint check |\n\n## CI / Workflows\n\n- **build.yml**: triggers on push/PR to `master` and `dev` — runs `yarn install --frozen-lockfile` + `yarn lint` + `yarn build`, then uploads `dist/` as artifact (7-day retention)\n- **docker-build-push.yml**: triggers on push to `master` — builds and pushes multi-arch image (`linux/amd64`, `linux/arm64`) to `careywong/subweb:latest`\n\n## Repository Layout\n\n```\nsrc/\n├── main.js                      # App bootstrap, plugin registration, Vue mount\n├── App.vue\n├── router/index.js              # Vue Router (history mode)\n├── views/Subconverter.vue       # Main page\n├── components/\n│   ├── ConfigUploadDialog.vue   # Config upload dialog\n│   ├── UrlParseDialog.vue       # URL parse dialog\n│   └── SvgIcon/index.vue        # SVG icon wrapper component\n├── composables/\n│   ├── useSubscription.js       # URL building logic (makeUrl, buildBaseUrl, buildAdvancedParams)\n│   ├── useSubscriptionForm.js   # Reactive form state + addCustomParam + saveSubUrl\n│   └── useUrlParser.js          # Short-link expansion + URL-to-form parser (analyzeUrl, parseUrl)\n├── services/\n│   ├── backendService.js        # BackendService.getBackendVersion()\n│   ├── shortUrlService.js       # ShortUrlService.generateShortUrl()\n│   └── configUploadService.js   # ConfigUploadService.uploadConfig(), handleUploadSuccess()\n├── config/\n│   ├── constants.js             # CONSTANTS (env-backed, DEFAULT_CLIENT_TYPE='clash')\n│   ├── client-types.js          # CLIENT_TYPES map (display label → target value)\n│   └── remote-configs.js        # REMOTE_CONFIGS grouped options array\n├── utils/\n│   ├── storage.js               # getLocalStorageItem / setLocalStorageItem (TTL-based)\n│   ├── validators.js            # validateSubUrl → { valid, message } | validateForm → boolean\n│   ├── formatters.js            # formatVersion, formatErrorMessage, processSubUrl\n│   ├── clipboard.js             # copyText (Clipboard API + execCommand fallback)\n│   └── search.js                # Backend autocomplete search helper\n├── plugins/                     # setupXxx(app) registrations (element-plus, axios, device)\n└── icons/\n    ├── index.js                 # Registers SVG sprite\n    └── svg/                     # SVG source files (e.g., github.svg)\nservices/                        # Docker Compose stack (subweb + myurls + redis)\n```\n\n## Key Modules\n\n### `src/config/constants.js`\nAll values read from `import.meta.env` with `VITE_` prefix. Key constants:\n- `DEFAULT_BACKEND` — appends `/sub?` to `VITE_SUBCONVERTER_DEFAULT_BACKEND`\n- `DEFAULT_CLIENT_TYPE` — hardcoded `'clash'`\n- `SHORT_URL_API`, `CONFIG_UPLOAD_API`, `PROJECT`, `BOT_LINK`, etc.\n\n### `src/composables/useSubscriptionForm.js`\nReturns plain object merged into `data()` via spread. Form fields include: `sourceSubUrl`, `clientType`, `customBackend`, `remoteConfig`, `emoji`, `nodeList`, `sort`, `udp`, `tfo`, `scv`, `fdn`, `expand`, `appendType`, `insert`, `new_name`, `tpl.surge.doh`, `tpl.clash.doh`. Default mode is advanced (`advanced: \"2\"`).\n\n### `src/composables/useSubscription.js`\n`makeUrl(form, advanced, processedSubUrl, currentBackend, customParams, needUdp)` — returns empty string on validation failure, otherwise builds full query string. Advanced mode adds remote config, include/exclude, filename, UDP, template, and custom params.\n\n### `src/composables/useUrlParser.js`\n`analyzeUrl(url)` — if URL contains `\"target\"`, returns as-is; otherwise fetches and returns `response.url` (short-link expansion, requires CORS on short-link service).  \n`parseUrl(url, form, customParams, onSuccess, onError)` — parses all query params back into form fields; unknown params become `customParams` entries.\n\n### `src/services/`\nAll service classes are static methods. They take `$axios` as first argument (injected via plugin). Silent failures are acceptable for `getBackendVersion`. Upload response shape: `{ code: 0, data: { url }, msg }`. Short URL response shape: `{ Code: 1, ShortUrl, Message }`.\n\n### `src/utils/storage.js`\nTTL stored inside the JSON value as `{ setTime, ttl, expire, value }`. `expire` checked on every read; expired entries are removed automatically. TTL value comes from `VITE_CACHE_TTL` env var.\n\n## Code Style\n\n- Indentation: 2 spaces\n- Quotes: single quotes preferred\n- Semicolons: none (`semi: 0`)\n- Vue component names: single-word allowed (`vue/multi-word-component-names: off`)\n- `no-console` / `no-debugger`: error in production, off in dev\n- ESLint extends: `plugin:vue/vue3-essential`, `eslint:recommended`\n- Parser: `@babel/eslint-parser` with `requireConfigFile: false`\n\n## Imports & Modules\n\n- ES modules (`import`/`export`) throughout\n- Absolute alias `@` maps to `src/` (see `vite.config.js`)\n- Import order: core libs → local config/utils → services → components\n- Dynamic imports only for route lazy-load\n\n## Vue Patterns\n\n- Options API everywhere; do not introduce Composition API or `<script setup>`\n- Component structure: `<template>`, `<script>`, `<style>`\n- Reactive state in `data()`; derived state in `computed`\n- Composables spread via `...useSubscription()` / `...useUrlParser()` in `methods`\n- `useSubscriptionForm()` spread via `...subscriptionForm` in `data()`\n- Globals registered on `app.config.globalProperties` (`$axios`, `$getOS`, `$message`, `$notify`)\n- Named slots only (`<template #header>`); `slot=\"x\"` and `$listeners` do not exist in Vue 3\n- Element Plus icon components exposed via `computed` (not `data`) to avoid reactive wrapping\n\n## Icons\n\n- SVG sprites via `vite-plugin-svg-icons`; icon dirs: `src/icons/svg`\n- Usage: `<svg-icon icon-class=\"name\" />`\n- Symbol ID format: `icon-[name]`\n- UI icons come from `@element-plus/icons-vue` as components; there are no `el-icon-*` font classes\n\n## Environment Variables\n\n- All env vars use `VITE_` prefix; access via `import.meta.env`\n- Do not commit `.env.local`, `.env.*.local`\n- Constants centralised in `src/config/constants.js` — do not scatter `import.meta.env` calls\n\n## Validation\n\n- Use `src/utils/validators.js` for user-facing checks\n- `validateSubUrl` returns `{ valid, message }`; `validateForm` returns boolean\n- Do not throw for validation flow\n\n## Error Handling\n\n- UI errors via `this.$message.*` or `this.$notify`\n- Silent failures acceptable only when UX demands it (e.g., backend version fetch)\n- Use `formatErrorMessage` from `src/utils/formatters.js` for consistent error strings\n\n## Docker\n\n- Base images: `node:24-alpine` (build), `nginx:1.24-alpine` (runtime)\n- Build: `yarn install && yarn build`, output copied to `/usr/share/nginx/html`\n- Services compose stack in `services/` includes myurls + Redis\n\n## Git Hygiene\n\n- Do not commit `dist/`, `node_modules/`, `.env.local`, `.env.*.local`\n- Avoid adding generated files\n\n## Frontend Safety\n\n- Avoid inline styles unless already present in nearby code\n- Prefer Element Plus components and existing patterns\n- Keep UI message strings consistent (mostly Chinese)\n- `.el-form-item__content` and `el-row` are flex containers in Element Plus; use `justify-content` / explicit widths rather than `text-align` to position controls\n\n## Performance\n\n- Do not introduce heavy dependencies; prefer existing utilities\n- Keep all network calls in `src/services/`\n\n## Example Patterns\n\n```js\n// Route lazy-load\ncomponent: () => import('../views/Subconverter.vue')\n\n// Plugin registration\nexport function setupAxios(app) {\n  app.config.globalProperties.$axios = axios\n}\n\n// Service class\nexport class BackendService {\n  static async getBackendVersion($axios) { ... }\n}\n\n// Composable (Options API style)\nexport function useSubscription() {\n  return { makeUrl, buildBaseUrl, buildAdvancedParams }\n}\n\n// Spread composable into methods\nmethods: {\n  ...useSubscription(),\n  ...useUrlParser()\n}\n\n// Spread form state into data()\ndata() {\n  return { ...useSubscriptionForm(), otherField: '' }\n}\n```\n\n## Suggested Manual Checks\n\n- `yarn lint`\n- `yarn build`\n- Run `yarn dev` and smoke the main screen\n\n## Notes for Agents\n\n- Follow existing patterns; minimise scope\n- No large refactors unless explicitly requested\n- Do not introduce TypeScript or new tooling without approval\n- No test runner configured; if added, document the single-test command here\n","category":"root","tokens":2212}]}